From f4df757febdfc59938086b4739686a59b1eb6a83 Mon Sep 17 00:00:00 2001
From: Neeraj Sharma <neeraj.sharma@viithiisys.com>
Date: Fri, 8 Nov 2019 17:53:15 +0530
Subject: [PATCH] responsive vie in mobile and solve buga

---
 src/pages/Account/expense.vue                   |  253 ++--
 src/pages/Account/feeTypes.vue                  |    6 +-
 src/pages/Account/income.vue                    |  249 ++-
 src/pages/Account/invoice.vue                   |   20 +-
 src/pages/Account/viewInvoice.vue               |   26 +-
 src/pages/Attendence/studentAttendence.vue      |    2 +-
 src/pages/Attendence/viewStudentsAttendence.vue |    4 +-
 src/pages/Class/addclass.vue                    |    8 +-
 src/pages/Dashboard/dashboard.vue               |    2 +-
 src/pages/Event/event.vue                       |  109 +-
 src/pages/Gallery/gallery.vue                   |  339 +++--
 src/pages/Holiday/holiday.vue                   |  132 +-
 src/pages/Library/member.vue                    |   20 +-
 src/pages/News/news.vue                         |  214 +--
 src/pages/NoticeBoard/noticeBoard.vue           |  194 +--
 src/pages/Notification/notification.vue         |  184 +--
 src/pages/Parent/parents.vue                    |  331 ++--
 src/pages/Section/section.vue                   |   14 +-
 src/pages/Students/students.vue                 | 1851 +++++++++++------------
 src/pages/Subjects/subjects.vue                 |   10 -
 src/pages/Teachers/teachers.vue                 |  609 ++++----
 src/pages/TimeTable/timeTable.vue               |  344 ++---
 src/pages/User/user.vue                         |  488 +++---
 src/pages/socialMedia/socialMedia.vue           |  128 +-
 static/css/custom.css                           |   12 +
 25 files changed, 2641 insertions(+), 2908 deletions(-)

diff --git a/src/pages/Account/expense.vue b/src/pages/Account/expense.vue
index 90dcfa5..61a0f7a 100644
--- a/src/pages/Account/expense.vue
+++ b/src/pages/Account/expense.vue
@@ -34,140 +34,136 @@
               <v-spacer></v-spacer>
             </v-toolbar>
             <v-card-text style="height: 600px;">
-              <v-form ref="form">
-                <v-container fluid>
-                  <v-layout>
-                    <v-flex
-                      xs12
-                      class="text-xs-center text-sm-center text-md-center text-lg-center my-4 mr-4"
-                    >
-                      <v-avatar size="160px">
-                        <img src="/static/icon/user.png" v-if="!editedItem.fileUrl && !imageUrl" />
-                        <img :src="editedItem.fileUrl" v-else-if="editedItem.fileUrl && !imageUrl" />
-                        <img
-                          v-if="imageUrl"
-                          :src="imageUrl"
-                          height="150"
-                          style="border-radius:50%; width:200px"
-                        />
-                      </v-avatar>
-                      <input
-                        type="file"
-                        style="display:none"
-                        ref="image"
-                        accept="image/*"
-                        @change="onFilePicked"
+                <v-layout>
+                  <v-flex
+                    xs12
+                    class="text-xs-center text-sm-center text-md-center text-lg-center my-4 mr-4"
+                  >
+                    <v-avatar size="160px">
+                      <img src="/static/icon/user.png" v-if="!editedItem.fileUrl && !imageUrl" />
+                      <img :src="editedItem.fileUrl" v-else-if="editedItem.fileUrl && !imageUrl" />
+                      <img
+                        v-if="imageUrl"
+                        :src="imageUrl"
+                        height="150"
+                        style="border-radius:50%; width:200px"
                       />
-                    </v-flex>
-                  </v-layout>
-                  <v-layout>
-                    <v-flex xs12 sm12>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Name:</label>
-                        </v-flex>
-                        <v-flex xs6 class="ml-3">
-                          <v-text-field
-                            v-model="editedItem.name"
-                            placeholder="fill your full Name"
-                            name="name"
-                            type="text"
-                            required
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
-                    </v-flex>
-                  </v-layout>
-                  <v-layout>
-                    <v-flex xs12>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Date:</label>
-                        </v-flex>
-                        <v-flex xs6 class="ml-3">
-                          <v-menu
-                            ref="menu"
-                            :close-on-content-click="false"
-                            v-model="menu3"
-                            :nudge-right="40"
-                            lazy
-                            transition="scale-transition"
-                            offset-y
-                            full-width
-                            min-width="290px"
-                          >
-                            <v-text-field
-                              slot="activator"
-                              v-model="editedItem.date"
-                              placeholder="Select date"
-                            ></v-text-field>
-                            <v-date-picker
-                              ref="picker"
-                              v-model="editedItem.date"
-                              @input="$refs.menu.save(editedItem.date)"
-                            ></v-date-picker>
-                          </v-menu>
-                        </v-flex>
-                      </v-layout>
-                    </v-flex>
+                    </v-avatar>
+                    <input
+                      type="file"
+                      style="display:none"
+                      ref="image"
+                      accept="image/*"
+                      @change="onFilePicked"
+                    />
+                  </v-flex>
+                </v-layout>
+                <v-layout wrap>
+                  <v-flex xs12 sm12>
                     <v-layout>
-                      <v-flex xs12 sm12>
-                        <v-layout>
-                          <v-flex xs4 class="pt-4 subheading">
-                            <label class="right">Amount:</label>
-                          </v-flex>
-                          <v-flex xs6 class="ml-3">
-                            <v-text-field v-model="editedItem.amount" required></v-text-field>
-                          </v-flex>
-                        </v-layout>
+                      <v-flex xs4 class="pt-4 subheading">
+                        <label class="right">Name:</label>
+                      </v-flex>
+                      <v-flex xs6 class="ml-3">
+                        <v-text-field
+                          v-model="editedItem.name"
+                          placeholder="fill your full Name"
+                          name="name"
+                          type="text"
+                          required
+                        ></v-text-field>
                       </v-flex>
                     </v-layout>
-                    <v-flex xs12>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right hidden-xs-only hidden-sm-only">Uplaod Image:</label>
-                          <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Uplaod:</label>
-                        </v-flex>
-                        <v-flex xs6 class="ml-3">
+                  </v-flex>
+                </v-layout>
+                <v-layout wrap>
+                  <v-flex xs12>
+                    <v-layout>
+                      <v-flex xs4 class="pt-4 subheading">
+                        <label class="right">Date:</label>
+                      </v-flex>
+                      <v-flex xs6 class="ml-3">
+                        <v-menu
+                          ref="menu"
+                          :close-on-content-click="false"
+                          v-model="menu3"
+                          :nudge-right="40"
+                          lazy
+                          transition="scale-transition"
+                          offset-y
+                          full-width
+                          min-width="290px"
+                        >
                           <v-text-field
-                            label="Select Image"
-                            @click="pickFile"
-                            v-model="imageName"
-                            append-icon="attach_file"
+                            slot="activator"
+                            v-model="editedItem.date"
+                            placeholder="Select date"
                           ></v-text-field>
-                        </v-flex>
-                      </v-layout>
-                    </v-flex>
-                    <v-flex xs12>
+                          <v-date-picker
+                            ref="picker"
+                            v-model="editedItem.date"
+                            @input="$refs.menu.save(editedItem.date)"
+                          ></v-date-picker>
+                        </v-menu>
+                      </v-flex>
+                    </v-layout>
+                  </v-flex>
+                  <v-layout wrap>
+                    <v-flex xs12 sm12>
                       <v-layout>
                         <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Note:</label>
+                          <label class="right">Amount:</label>
                         </v-flex>
                         <v-flex xs6 class="ml-3">
-                          <v-textarea
-                            name="input-7-1"
-                            v-model="editedItem.note"
-                            placeholder="fill your Note"
-                            type="text"
-                            :rules="noteRules"
-                            multi-line
-                            required
-                          ></v-textarea>
+                          <v-text-field v-model="editedItem.amount" required></v-text-field>
                         </v-flex>
                       </v-layout>
                     </v-flex>
                   </v-layout>
-                  <v-layout>
-                    <v-flex xs12 sm12>
-                      <v-card-actions>
-                        <v-btn round dark @click.native="close">Cancel</v-btn>
-                        <v-spacer></v-spacer>
-                        <v-btn round dark :loading="loading" @click="save">Save</v-btn>
-                      </v-card-actions>
-                    </v-flex>
-                  </v-layout>
-                </v-container>
-              </v-form>
+                  <v-flex xs12>
+                    <v-layout wrap>
+                      <v-flex xs4 class="pt-4 subheading">
+                        <label class="right hidden-xs-only hidden-sm-only">Uplaod Image:</label>
+                        <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Uplaod:</label>
+                      </v-flex>
+                      <v-flex xs6 class="ml-3">
+                        <v-text-field
+                          label="Select Image"
+                          @click="pickFile"
+                          v-model="imageName"
+                          append-icon="attach_file"
+                        ></v-text-field>
+                      </v-flex>
+                    </v-layout>
+                  </v-flex>
+                  <v-flex xs12>
+                    <v-layout>
+                      <v-flex xs4 class="pt-4 subheading">
+                        <label class="right">Note:</label>
+                      </v-flex>
+                      <v-flex xs6 class="ml-3">
+                        <v-textarea
+                          name="input-7-1"
+                          v-model="editedItem.note"
+                          placeholder="fill your Note"
+                          type="text"
+                          :rules="noteRules"
+                          multi-line
+                          required
+                        ></v-textarea>
+                      </v-flex>
+                    </v-layout>
+                  </v-flex>
+                </v-layout>
+                <v-layout>
+                  <v-flex xs12 sm12>
+                    <v-card-actions>
+                      <v-btn round dark @click.native="close">Cancel</v-btn>
+                      <v-spacer></v-spacer>
+                      <v-btn round dark :loading="loading" @click="save">Save</v-btn>
+                    </v-card-actions>
+                  </v-flex>
+                </v-layout>
             </v-card-text>
           </v-card>
         </v-dialog>
@@ -447,17 +443,16 @@
                       </v-flex>
                     </v-layout>
                   </v-layout>
-                  <v-layout>
-                    <v-flex xs12 sm12>
-                      <v-card-actions>
-                        <v-flex xs12 sm5>
-                          <v-btn @click="clear" class="right" round dark>clear</v-btn>
+                   <v-layout>
+                    <v-flex xs12 sm6 offset-sm3>
+                      <v-layout>
+                        <v-flex xs6>
+                          <v-btn @click="clear" round class="ml-3" dark>clear</v-btn>
                         </v-flex>
-                        <v-spacer></v-spacer>
-                        <v-flex xs12 sm5>
-                          <v-btn @click="submit" round dark :loading="loading">Add</v-btn>
+                        <v-flex xs6>
+                          <v-btn @click="submit" round dark :loading="loading" class="right">Add</v-btn>
                         </v-flex>
-                      </v-card-actions>
+                      </v-layout>
                     </v-flex>
                   </v-layout>
                 </v-container>
diff --git a/src/pages/Account/feeTypes.vue b/src/pages/Account/feeTypes.vue
index 68b7bd6..7a7f8b6 100644
--- a/src/pages/Account/feeTypes.vue
+++ b/src/pages/Account/feeTypes.vue
@@ -36,11 +36,9 @@
             <v-spacer></v-spacer>
           </v-toolbar>
           <v-card>
-            <v-card-text>
-              <v-container>
+              <v-container fluid>
                 <v-layout wrap justify-center>
                   <v-flex xs12 sm9>
-                    <v-form>
                       <v-layout>
                         <v-flex xs4 class="pt-4 subheading">
                           <label class="right pr-3">Fee Type:</label>
@@ -74,11 +72,9 @@
                         <v-spacer></v-spacer>
                         <v-btn round dark @click="save">Save</v-btn>
                       </v-card-actions>
-                    </v-form>
                   </v-flex>
                 </v-layout>
               </v-container>
-            </v-card-text>
           </v-card>
         </v-dialog>
 
diff --git a/src/pages/Account/income.vue b/src/pages/Account/income.vue
index cd528f4..eada6d3 100644
--- a/src/pages/Account/income.vue
+++ b/src/pages/Account/income.vue
@@ -34,140 +34,136 @@
               <v-spacer></v-spacer>
             </v-toolbar>
             <v-card-text style="height: 600px;">
-              <v-form ref="form">
-                <v-container fluid>
+              <v-layout>
+                <v-flex
+                  xs12
+                  class="text-xs-center text-sm-center text-md-center text-lg-center my-4 mr-4"
+                >
+                  <v-avatar size="160px">
+                    <img src="/static/icon/user.png" v-if="!editedItem.fileUrl && !imageUrl" />
+                    <img :src="editedItem.fileUrl" v-else-if="editedItem.fileUrl && !imageUrl" />
+                    <img
+                      v-if="imageUrl"
+                      :src="imageUrl"
+                      height="150"
+                      style="border-radius:50%; width:200px"
+                    />
+                  </v-avatar>
+                  <input
+                    type="file"
+                    style="display:none"
+                    ref="image"
+                    accept="image/*"
+                    @change="onFilePicked"
+                  />
+                </v-flex>
+              </v-layout>
+              <v-layout wrap>
+                <v-flex xs12 sm12>
                   <v-layout>
-                    <v-flex
-                      xs12
-                      class="text-xs-center text-sm-center text-md-center text-lg-center my-4 mr-4"
-                    >
-                      <v-avatar size="160px">
-                        <img src="/static/icon/user.png" v-if="!editedItem.fileUrl && !imageUrl" />
-                        <img :src="editedItem.fileUrl" v-else-if="editedItem.fileUrl && !imageUrl" />
-                        <img
-                          v-if="imageUrl"
-                          :src="imageUrl"
-                          height="150"
-                          style="border-radius:50%; width:200px"
-                        />
-                      </v-avatar>
-                      <input
-                        type="file"
-                        style="display:none"
-                        ref="image"
-                        accept="image/*"
-                        @change="onFilePicked"
-                      />
+                    <v-flex xs4 class="pt-4 subheading">
+                      <label class="right">Name:</label>
                     </v-flex>
-                  </v-layout>
-                  <v-layout>
-                    <v-flex xs12 sm12>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Name:</label>
-                        </v-flex>
-                        <v-flex xs8 sm6 class="ml-3">
-                          <v-text-field
-                            v-model="editedItem.name"
-                            placeholder="fill your full Name"
-                            name="name"
-                            type="text"
-                            required
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
+                    <v-flex xs8 sm6 class="ml-3">
+                      <v-text-field
+                        v-model="editedItem.name"
+                        placeholder="fill your full Name"
+                        name="name"
+                        type="text"
+                        required
+                      ></v-text-field>
                     </v-flex>
                   </v-layout>
+                </v-flex>
+              </v-layout>
+              <v-layout wrap>
+                <v-flex xs12>
                   <v-layout>
-                    <v-flex xs12>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Date:</label>
-                        </v-flex>
-                        <v-flex xs8 sm6 class="ml-3">
-                          <v-menu
-                            ref="menu"
-                            :close-on-content-click="false"
-                            v-model="menu3"
-                            :nudge-right="40"
-                            lazy
-                            transition="scale-transition"
-                            offset-y
-                            full-width
-                            min-width="290px"
-                          >
-                            <v-text-field
-                              slot="activator"
-                              v-model="editedItem.date"
-                              placeholder="Select date"
-                            ></v-text-field>
-                            <v-date-picker
-                              ref="picker"
-                              v-model="editedItem.date"
-                              @input="$refs.menu.save(editedItem.date)"
-                            ></v-date-picker>
-                          </v-menu>
-                        </v-flex>
-                      </v-layout>
+                    <v-flex xs4 class="pt-4 subheading">
+                      <label class="right">Date:</label>
+                    </v-flex>
+                    <v-flex xs8 sm6 class="ml-3">
+                      <v-menu
+                        ref="menu"
+                        :close-on-content-click="false"
+                        v-model="menu3"
+                        :nudge-right="40"
+                        lazy
+                        transition="scale-transition"
+                        offset-y
+                        full-width
+                        min-width="290px"
+                      >
+                        <v-text-field
+                          slot="activator"
+                          v-model="editedItem.date"
+                          placeholder="Select date"
+                        ></v-text-field>
+                        <v-date-picker
+                          ref="picker"
+                          v-model="editedItem.date"
+                          @input="$refs.menu.save(editedItem.date)"
+                        ></v-date-picker>
+                      </v-menu>
                     </v-flex>
+                  </v-layout>
+                </v-flex>
+                <v-layout wrap>
+                  <v-flex xs12 sm12>
                     <v-layout>
-                      <v-flex xs12 sm12>
-                        <v-layout>
-                          <v-flex xs4 class="pt-4 subheading">
-                            <label class="right">Amount:</label>
-                          </v-flex>
-                          <v-flex xs8 sm6 class="ml-3">
-                            <v-text-field v-model="editedItem.amount" required></v-text-field>
-                          </v-flex>
-                        </v-layout>
+                      <v-flex xs4 class="pt-4 subheading">
+                        <label class="right">Amount:</label>
+                      </v-flex>
+                      <v-flex xs8 sm6 class="ml-3">
+                        <v-text-field v-model="editedItem.amount" required></v-text-field>
                       </v-flex>
                     </v-layout>
-                    <v-flex xs12>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right hidden-xs-only hidden-sm-only">Uplaod Image:</label>
-                          <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Uplaod:</label>
-                        </v-flex>
-                        <v-flex xs8 sm6  class="ml-3">
-                          <v-text-field
-                            label="Select Image"
-                            @click="pickFile"
-                            v-model="imageName"
-                            append-icon="attach_file"
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
+                  </v-flex>
+                </v-layout>
+                <v-flex xs12>
+                  <v-layout>
+                    <v-flex xs4 class="pt-4 subheading">
+                      <label class="right hidden-xs-only hidden-sm-only">Uplaod Image:</label>
+                      <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Uplaod:</label>
                     </v-flex>
-                    <v-flex xs12>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Note:</label>
-                        </v-flex>
-                        <v-flex xs8 sm6  class="ml-3">
-                          <v-textarea
-                            name="input-7-1"
-                            v-model="editedItem.note"
-                            placeholder="fill your Note"
-                            type="text"
-                            :rules="noteRules"
-                            multi-line
-                            required
-                          ></v-textarea>
-                        </v-flex>
-                      </v-layout>
+                    <v-flex xs8 sm6 class="ml-3">
+                      <v-text-field
+                        label="Select Image"
+                        @click="pickFile"
+                        v-model="imageName"
+                        append-icon="attach_file"
+                      ></v-text-field>
                     </v-flex>
                   </v-layout>
+                </v-flex>
+                <v-flex xs12>
                   <v-layout>
-                    <v-flex xs12 sm12>
-                      <v-card-actions>
-                        <v-btn round dark @click.native="close">Cancel</v-btn>
-                        <v-spacer></v-spacer>
-                        <v-btn round dark :loading="loading" @click="save">Save</v-btn>
-                      </v-card-actions>
+                    <v-flex xs4 class="pt-4 subheading">
+                      <label class="right">Note:</label>
+                    </v-flex>
+                    <v-flex xs8 sm6 class="ml-3">
+                      <v-textarea
+                        name="input-7-1"
+                        v-model="editedItem.note"
+                        placeholder="fill your Note"
+                        type="text"
+                        :rules="noteRules"
+                        multi-line
+                        required
+                      ></v-textarea>
                     </v-flex>
                   </v-layout>
-                </v-container>
-              </v-form>
+                </v-flex>
+              </v-layout>
+              <v-layout>
+                <v-flex xs12 sm12>
+                  <v-card-actions>
+                    <v-btn round dark @click.native="close">Cancel</v-btn>
+                    <v-spacer></v-spacer>
+                    <v-btn round dark :loading="loading" @click="save">Save</v-btn>
+                  </v-card-actions>
+                </v-flex>
+              </v-layout>
             </v-card-text>
           </v-card>
         </v-dialog>
@@ -448,16 +444,15 @@
                     </v-layout>
                   </v-layout>
                   <v-layout>
-                    <v-flex xs12 sm12>
-                      <v-card-actions>
-                        <v-flex xs12 sm5>
-                          <v-btn @click="clear" class="right" round dark>clear</v-btn>
+                    <v-flex xs12 sm5 offset-sm3>
+                      <v-layout>
+                        <v-flex xs6>
+                          <v-btn @click="clear" round class="ml-3" dark>clear</v-btn>
                         </v-flex>
-                        <v-spacer></v-spacer>
-                        <v-flex xs12 sm5>
-                          <v-btn @click="submit" round dark :loading="loading">Add</v-btn>
+                        <v-flex xs6>
+                          <v-btn @click="submit" round dark :loading="loading" class="right">Add</v-btn>
                         </v-flex>
-                      </v-card-actions>
+                      </v-layout>
                     </v-flex>
                   </v-layout>
                 </v-container>
diff --git a/src/pages/Account/invoice.vue b/src/pages/Account/invoice.vue
index be140bb..23ab155 100644
--- a/src/pages/Account/invoice.vue
+++ b/src/pages/Account/invoice.vue
@@ -180,7 +180,7 @@
           >{{ text }}</v-snackbar>
           <v-flex xs12 sm12>
             <v-container fluid>
-              <v-layout>
+              <v-layout wrap>
                 <v-flex xs12 sm12 md5 class="mt-4">
                   <v-card flat>
                     <v-toolbar dark class="fixcolors" flat>
@@ -193,7 +193,8 @@
                     <v-form ref="form" v-model="valid" lazy-validation class="py-4">
                       <v-layout>
                         <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Select Class:</label>
+                          <label class="right hidden-xs-only hidden-sm-only">Select Class:</label>
+                          <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Class:</label>
                         </v-flex>
                         <v-flex xs6 class="ml-3">
                           <v-select
@@ -210,7 +211,8 @@
                       </v-layout>
                       <v-layout>
                         <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Select Student:</label>
+                          <label class="right hidden-xs-only hidden-sm-only">Select Student:</label>
+                          <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Student:</label>
                         </v-flex>
                         <v-flex xs6 class="ml-3">
                           <v-select
@@ -256,7 +258,8 @@
                       </v-layout>
                       <v-layout>
                         <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Payment Status:</label>
+                          <label class="right hidden-xs-only hidden-sm-only">Payment Status:</label>
+                          <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Payment:</label>
                         </v-flex>
                         <v-flex xs6 class="ml-3">
                           <v-select
@@ -306,10 +309,10 @@
                       <v-spacer></v-spacer>
                     </v-toolbar>
                     <v-layout>
-                      <v-flex xs2 class="mt-4">
+                      <v-flex xs4 sm2 class="mt-4">
                         <label class="right title">Fee Type:</label>
                       </v-flex>
-                      <v-flex xs4>
+                      <v-flex xs4 sm4>
                         <v-select
                           :items="feeTypes"
                           v-model="feeType.feeTypeName"
@@ -318,11 +321,11 @@
                           label="Select Fee Type"
                         ></v-select>
                       </v-flex>
-                      <v-flex xs6>
+                      <v-flex xs4 sm6>
                         <v-btn color="black" dark class="right mt-3" @click="selectFeeType">ADD</v-btn>
                       </v-flex>
                     </v-layout>
-                    <table class="feeTypeTable">
+                    <table class="feeTypeTable tableRsponsive">
                       <tr class="info white--text">
                         <th>#</th>
                         <th>Fee Type</th>
@@ -720,7 +723,6 @@ export default {
         paidAmount: ""
       };
       for (let i = 0; i < this.feeTypeData.length; i++) {
-        
         // *********** AMOUNT ***********
 
         feeType.amount =
diff --git a/src/pages/Account/viewInvoice.vue b/src/pages/Account/viewInvoice.vue
index e083d6c..06246b2 100644
--- a/src/pages/Account/viewInvoice.vue
+++ b/src/pages/Account/viewInvoice.vue
@@ -9,32 +9,32 @@
                     <v-layout wrap> 
                       <v-flex xs12 sm6>
                     <v-layout>
-                      <v-flex xs6 sm2>
+                      <v-flex xs4 sm2>
                         <h5 class="right my-1">
                           <b>invoice:</b>
                         </h5>
                       </v-flex>
-                      <v-flex sm11 xs6>
+                      <v-flex sm11 xs8>
                         <h5 class="my-1">#{{ invoiceParticularData.invoiceNumber }}</h5>
                       </v-flex>
                     </v-layout>
                     <v-layout>
-                      <v-flex xs6 sm2>
+                      <v-flex xs4 sm2>
                         <h5 class="right my-1">
                           <b>Name:</b>
                         </h5>
                       </v-flex>
-                      <v-flex sm11 xs6>
+                      <v-flex sm11 xs8>
                         <h5 class="my-1">{{ invoiceParticularData.studentId.name }}</h5>
                       </v-flex>
                     </v-layout>
                      <v-layout>
-                      <v-flex xs6 sm2>
+                      <v-flex xs4 sm2>
                         <h5 class="right my-1">
                           <b>Class:</b>
                         </h5>
                       </v-flex>
-                      <v-flex sm11 xs6>
+                      <v-flex sm11 xs8>
                         <h5 class="my-1">{{ invoiceParticularData.classId.classNum }}</h5>
                       </v-flex>
                     </v-layout>
@@ -42,32 +42,32 @@
                       <v-flex xs12 sm6>
 
                     <v-layout>
-                        <v-flex xs6 sm2>
+                        <v-flex xs4 sm2>
                         <h5 class="right my-1">
                           <b>Roll No:</b>
                         </h5>
                       </v-flex>
-                      <v-flex sm6 xs6>
+                      <v-flex sm6 xs8>
                         <h5 class="my-1">{{ invoiceParticularData.studentId.rollNo }}</h5>
                       </v-flex>
                     </v-layout>
                     <v-layout>
-                        <v-flex xs6 sm2>
+                        <v-flex xs4 sm2>
                         <h5 class="right my-1">
                           <b>email:</b>
                         </h5>
                       </v-flex>
-                      <v-flex sm6 xs6>
-                         <h5 class="my-1">{{ invoiceParticularData.studentId.email }}</h5>
+                      <v-flex sm6 xs8>
+                         <h5 class="my-1 linkCover">{{ invoiceParticularData.studentId.email }}</h5>
                       </v-flex>
                     </v-layout>
                     <v-layout>
-                        <v-flex xs6 sm2>
+                        <v-flex xs4 sm2>
                         <h5 class="right my-1">
                           <b>Status :</b>
                         </h5>
                       </v-flex>
-                      <v-flex sm6 xs6>
+                      <v-flex sm6 xs8>
                         <h5 class="my-1">{{ invoiceParticularData.paymentStatus }}</h5>
                       </v-flex>
                     </v-layout>
diff --git a/src/pages/Attendence/studentAttendence.vue b/src/pages/Attendence/studentAttendence.vue
index 80c7f69..4e4cf69 100644
--- a/src/pages/Attendence/studentAttendence.vue
+++ b/src/pages/Attendence/studentAttendence.vue
@@ -23,7 +23,7 @@
           </download-csv>-->
         </v-layout>
         <v-spacer></v-spacer>
-        <v-flex xs12 sm2>
+        <v-flex xs12 sm4 md2>
           <v-select
             outline
             small
diff --git a/src/pages/Attendence/viewStudentsAttendence.vue b/src/pages/Attendence/viewStudentsAttendence.vue
index fd7b54b..b2f496b 100644
--- a/src/pages/Attendence/viewStudentsAttendence.vue
+++ b/src/pages/Attendence/viewStudentsAttendence.vue
@@ -72,7 +72,7 @@
       </v-dialog>
     </v-layout>
     <v-layout wrap>
-      <v-flex xs12 sm4>
+      <v-flex xs12 sm12 md4>
         <v-card flat>
           <h3 class="text-xs-center py-2 grey lighten-1 white--text">Profile</h3>
           <v-card-text>
@@ -134,7 +134,7 @@
           </v-card-text>
         </v-card>
       </v-flex>
-      <v-flex xs12 sm8>
+      <v-flex xs12 sm12 md8>
         <v-card flat>
           <h3 class="py-2 text-xs-center grey lighten-1 white--text">
             Attendence
diff --git a/src/pages/Class/addclass.vue b/src/pages/Class/addclass.vue
index e62078f..af3c22c 100644
--- a/src/pages/Class/addclass.vue
+++ b/src/pages/Class/addclass.vue
@@ -17,7 +17,7 @@
         class="subheading"
       >Add New Class</v-tab>
 
-      <!-- ****** EDITS  ADD ClASS  ****** -->
+      <!-- ****** EDIT  ClASS  ****** -->
       <v-tab-item>
         <v-snackbar
           :timeout="timeout"
@@ -41,10 +41,10 @@
                   <v-layout justify-center>
                     <v-flex xs12 sm9>
                         <v-layout style="position:relative;">
-                          <v-flex xs4 lg2 class="pt-4 subheading">
-                            <label>Class:</label>
+                          <v-flex xs3 lg2 class="pt-4 subheading">
+                            <label class="right">Class:</label>
                           </v-flex>
-                          <v-flex xs10>
+                          <v-flex xs9 class="ml-2">
                             <v-autocomplete
                               v-model="editedItem.classNum"
                               :label="editedItem.classNum"
diff --git a/src/pages/Dashboard/dashboard.vue b/src/pages/Dashboard/dashboard.vue
index 51a9dea..c012062 100644
--- a/src/pages/Dashboard/dashboard.vue
+++ b/src/pages/Dashboard/dashboard.vue
@@ -56,7 +56,7 @@
             <!-- ***** Total Class***** -->
             <v-flex xs12 sm12 lg3 md4>
               <v-card width="90" height="90" class="ml-3 pa-1 white khasraIcon" dark>
-                <img src="/static/schoolIcons/Class.png" width="80" class="s" alt="class" />
+                <img src="/static/schoolIcons/Class.png" width="80" class="iconOfDashboard" alt="class" />
               </v-card>
               <v-card class="pa-3" style="margin-top: -44px;">
                 <div class="body-2 grey--text text-xs-right">Class</div>
diff --git a/src/pages/Event/event.vue b/src/pages/Event/event.vue
index 2876d18..8914e68 100644
--- a/src/pages/Event/event.vue
+++ b/src/pages/Event/event.vue
@@ -38,31 +38,7 @@
               <v-spacer></v-spacer>
             </v-toolbar>
             <v-card flat>
-              <v-form ref="form">
                 <v-container fluid>
-                  <v-layout>
-                    <!-- <v-flex
-                      xs12
-                      class="text-xs-center text-sm-center text-md-center text-lg-center mr-4"
-                    >
-                      <v-avatar size="100px">
-                        <img src="/static/icon/user.png" />
-                    </v-avatar>-->
-                    <!-- <input
-                        type="file"
-                        style="display: none"
-                        ref="image"
-                        accept="image/*"
-                        @change="onFilePicked"
-                      />
-                      <img
-                        :src="imageData.imageUrl"
-                        height="150"
-                        v-if="imageUrl"
-                        style="border-radius:50%; width:200px"
-                    />-->
-                    <!-- </v-flex> -->
-                  </v-layout>
                   <v-flex xs12 sm12>
                     <v-layout>
                       <v-flex xs4 class="pt-4 subheading">
@@ -83,7 +59,7 @@
                       <v-flex xs4 class="pt-4 subheading">
                         <label class="right">Date:</label>
                       </v-flex>
-                      <v-flex xs8 sm5  class="ml-3">
+                      <v-flex xs8 sm5 class="ml-3">
                         <v-menu
                           ref="menu"
                           :close-on-content-click="false"
@@ -135,7 +111,6 @@
                     </v-flex>
                   </v-layout>
                 </v-container>
-              </v-form>
             </v-card>
           </v-flex>
         </v-dialog>
@@ -210,7 +185,7 @@
           :search="search"
         >
           <template slot="items" slot-scope="props">
-            <td id="td" class="text-xs-center">{{ props.index  + 1}}</td>
+            <td id="td" class="text-xs-center">{{ props.index + 1}}</td>
             <td id="td" class="text-xs-center">{{ props.item.title}}</td>
             <td id="td" class="text-xs-center">{{ dates(props.item.dateOfEvent)}}</td>
             <td id="td" class="text-xs-center">{{ props.item.description}}</td>
@@ -259,39 +234,16 @@
             v-model="snackbar"
             color="success"
           >{{ text }}</v-snackbar>
-          <v-flex xs12 sm12 class="my-4">
+          <v-flex xs12 sm12 md8 offset-md2 class="top">
             <v-card flat>
               <v-form ref="form" v-model="valid" lazy-validation>
                 <v-container fluid>
-                  <v-layout>
-                    <!-- <v-flex
-                      xs12
-                      class="text-xs-center text-sm-center text-md-center text-lg-center my-4 mr-4"
-                    >
-                      <v-avatar size="100px">
-                        <img src="/static/icon/user.png" />
-                    </v-avatar>-->
-                    <!-- <input
-                        type="file"
-                        style="display: none"
-                        ref="image"
-                        accept="image/*"
-                        @change="onFilePicked"
-                      />
-                      <img
-                        :src="imageData.imageUrl"
-                        height="150"
-                        v-if="imageUrl"
-                        style="border-radius:50%; width:200px"
-                    />-->
-                    <!-- </v-flex> -->
-                  </v-layout>
                   <v-flex xs12>
                     <v-layout>
                       <v-flex xs4 class="pt-4 subheading">
                         <label class="right">Title:</label>
                       </v-flex>
-                      <v-flex xs4 class="ml-3">
+                      <v-flex xs8 sm6 class="ml-3">
                         <v-text-field
                           v-model="addEvent.title"
                           placeholder="fill your Title"
@@ -307,7 +259,7 @@
                       <v-flex xs4 class="pt-4 subheading">
                         <label class="right">Date:</label>
                       </v-flex>
-                      <v-flex xs4 class="ml-3">
+                      <v-flex xs8 sm6 class="ml-3">
                         <v-menu
                           ref="menu1"
                           :close-on-content-click="false"
@@ -342,7 +294,7 @@
                       <v-flex xs4 class="pt-4 subheading">
                         <label class="right">Description:</label>
                       </v-flex>
-                      <v-flex xs4 class="ml-3">
+                      <v-flex xs8 sm6 class="ml-3">
                         <v-text-field
                           placeholder="fill your Description"
                           :rules="descriptionRules"
@@ -354,12 +306,15 @@
                     </v-layout>
                   </v-flex>
                   <v-layout>
-                    <v-flex xs12 sm6 offset-sm3>
-                      <v-card-actions>
-                        <v-btn @click="clear" round dark>clear</v-btn>
-                        <v-spacer></v-spacer>
-                        <v-btn @click="submit" round dark :loading="loading">Add</v-btn>
-                      </v-card-actions>
+                    <v-flex xs12 sm9 offset-sm2>
+                      <v-layout>
+                        <v-flex xs6>
+                          <v-btn @click="clear" round class="ml-3" dark>clear</v-btn>
+                        </v-flex>
+                        <v-flex xs6>
+                          <v-btn @click="submit" round dark :loading="loading" class="right">Add</v-btn>
+                        </v-flex>
+                      </v-layout>
                     </v-flex>
                   </v-layout>
                 </v-container>
@@ -403,10 +358,6 @@ export default {
     date: null,
     menu1: false,
     menu: false,
-    // imageData: {},
-    // imageName: "",
-    // imageUrl: "",
-    // imageFile: "",
     titleRules: [v => !!v || " Tilte is required"],
     descriptionRules: [v => !!v || " Discription is required"],
     dateRules: [v => !!v || "Date is required"],
@@ -418,6 +369,8 @@ export default {
         value: "No"
       },
       { text: "Title", value: "title", sortable: false, align: "center" },
+      { text: "Date", value: "date", sortable: false, align: "center" },
+
       {
         text: "Description",
         value: "description",
@@ -432,34 +385,6 @@ export default {
     editedItem: {}
   }),
   methods: {
-    // pickFile() {
-    //   this.$refs.image.click();
-    // },
-
-    // onFilePicked(e) {
-    //   // console.log(e)
-    //   const files = e.target.files;
-    //   this.imageData.upload = e.target.files[0];
-    //   if (files[0] !== undefined) {
-    //     this.imageName = files[0].name;
-    //     if (this.imageName.lastIndexOf(".") <= 0) {
-    //       return;
-    //     }
-    //     const fr = new FileReader();
-    //     fr.readAsDataURL(files[0]);
-    //     fr.addEventListener("load", () => {
-    //       this.imageUrl = fr.result;
-    //       this.imageFile = files[0]; // this is an image file that can be sent to server...
-    //       this.imageData.imageUrl = URL.createObjectURL(this.imageFile);
-    //       console.log("upload=======>", this.imageData.imageUrl);
-    //       console.log("imageFile", this.imageFile);
-    //     });
-    //   } else {
-    //     this.imageName = "";
-    //     this.imageFile = "";
-    //     this.imageUrl = "";
-    //   }
-    // },
     dates: function(date) {
       return moment(date).format("MMMM DD, YYYY");
     },
diff --git a/src/pages/Gallery/gallery.vue b/src/pages/Gallery/gallery.vue
index 16578e1..815ee89 100644
--- a/src/pages/Gallery/gallery.vue
+++ b/src/pages/Gallery/gallery.vue
@@ -38,181 +38,178 @@
               <v-spacer></v-spacer>
             </v-toolbar>
             <v-card-text style="height:700px;">
-              <v-form ref="form">
-                <v-container fluid>
-                  <v-layout row>
+              <v-layout row>
+                <v-flex
+                  xs12
+                  class="text-xs-center text-sm-center text-md-center text-lg-center my-4"
+                >
+                  <input
+                    type="file"
+                    style="display: none"
+                    ref="editImage"
+                    accept="image/*"
+                    multiple
+                    @change="editFilePicked"
+                  />
+                  <v-layout justify-center>
                     <v-flex
-                      xs12
-                      class="text-xs-center text-sm-center text-md-center text-lg-center my-4 mr-4"
+                      xs6
+                      sm12
+                      md3
+                      v-for="Image in editedItem.imageUrl"
+                      :key="Image._id"
+                      v-if="editedItem.imageUrl"
+                      class="profile-image-wrapper imgNews"
                     >
-                      <input
-                        type="file"
-                        style="display: none"
-                        ref="editImage"
-                        accept="image/*"
-                        multiple
-                        @change="editFilePicked"
-                      />
-                      <v-layout justify-center>
-                        <v-flex
-                          xs3
-                          v-for="Image in editedItem.imageUrl"
-                          :key="Image._id"
-                          v-if="editedItem.imageUrl"
-                          class="profile-image-wrapper"
-                        >
-                          <img
-                            :src="Image.imageLink"
-                            height="160"
-                            width="160"
-                            alt="Gallery"
-                            class="pa-2"
-                          />
-                          <v-icon
-                            class="red edit-profile-icon"
-                            dark
-                            @click="deleteImage(Image._id,editedItem._id)"
-                          >close</v-icon>
-                        </v-flex>
-                        <v-flex v-for="(file, index) in editFiles" :key="index">
-                          <img :src="file" height="160" width="160" class="pa-2" />
-                        </v-flex>
-                      </v-layout>
                       <img
-                        src="/static/icon/user.png"
-                        v-if="editedItem.imageUrl == '' && editFiles == ''"
+                        :src="Image.imageLink"
                         height="160"
                         width="160"
                         alt="Gallery"
+                        class="pa-2 imgNews"
                       />
+                      <v-icon
+                        class="red edit-profile-icon"
+                        dark
+                        @click="deleteImage(Image._id,editedItem._id)"
+                      >close</v-icon>
+                    </v-flex>
+                    <v-flex v-for="(file, index) in editFiles" :key="index">
+                      <img :src="file" height="160" width="160" class="pa-2 imgNews" />
                     </v-flex>
                   </v-layout>
-                  <!-- </v-layout> -->
+                  <img
+                    src="/static/icon/user.png"
+                    v-if="editedItem.imageUrl == '' && editFiles == ''"
+                    height="160"
+                    width="160"
+                    alt="Gallery"
+                  />
+                </v-flex>
+              </v-layout>
+              <v-layout wrap>
+                <v-flex xs12 sm12>
                   <v-layout>
-                    <v-flex xs12 sm12>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Title:</label>
-                        </v-flex>
-                        <v-flex xs8 sm5 class="ml-3">
-                          <v-text-field
-                            v-model="editedItem.title"
-                            placeholder="fill your Title"
-                            name="name"
-                            type="text"
-                            required
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
+                    <v-flex xs4 class="pt-4 subheading">
+                      <label class="right">Title:</label>
                     </v-flex>
-                    <v-flex xs12 sm12>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Description:</label>
-                        </v-flex>
-                        <v-flex xs8 sm5 class="ml-3">
-                          <v-text-field
-                            placeholder="fill your Description"
-                            v-model="editedItem.description"
-                            type="text"
-                            name="email"
-                            required
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
+                    <v-flex xs8 sm5 class="ml-3">
+                      <v-text-field
+                        v-model="editedItem.title"
+                        placeholder="fill your Title"
+                        name="name"
+                        type="text"
+                        required
+                      ></v-text-field>
                     </v-flex>
-                    <v-layout>
-                      <v-flex xs4 class="pt-4 subheading">
-                        <label class="right hidden-xs-only hidden-sm-only">Select Class:</label>
-                        <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Class:</label>
-                      </v-flex>
-                      <v-flex xs8 sm5 class="ml-3">
-                        <v-select
-                          :items="addclass"
-                          label="Select Class"
-                          v-model="editedItem.classNum"
-                          item-text="classNum"
-                          item-value="_id"
-                          name="Select Class"
-                          required
-                        ></v-select>
-                      </v-flex>
-                    </v-layout>
-                    <v-flex xs12>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right hidden-xs-only hidden-sm-only">Add New Images:</label>
-                        <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Upload:</label>
-                        </v-flex>
-                        <v-flex xs8 sm5 class="ml-3">
-                          <v-text-field
-                            label="Select Image"
-                            @click="editPickFile"
-                            v-model="editImageName"
-                            append-icon="attach_file"
-                            multiple
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
+                  </v-layout>
+                </v-flex>
+                <v-flex xs12 sm12>
+                  <v-layout>
+                    <v-flex xs4 class="pt-4 subheading">
+                      <label class="right">Description:</label>
+                    </v-flex>
+                    <v-flex xs8 sm5 class="ml-3">
+                      <v-text-field
+                        placeholder="fill your Description"
+                        v-model="editedItem.description"
+                        type="text"
+                        name="email"
+                        required
+                      ></v-text-field>
                     </v-flex>
                   </v-layout>
-                  <v-flex xs12>
-                    <div
-                      v-for="(editImage,index) in editedItem.youTubeLinkUrl"
-                      :key="index"
-                      v-if="editImage.youTubeLink !=[]"
-                    >
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">You Tube Link Url:</label>
-                        </v-flex>
-                        <v-flex xs8 sm5 class="ml-3">
-                          <v-text-field
-                            v-model="editImage.youTubeLink"
-                            type="text"
-                            name="link"
-                            required
-                          ></v-text-field>
-                        </v-flex>
-                        <v-flex xs2 class="pt-4">
-                          <v-icon @click="deleteUrl(index,editImage._id,editedItem._id)">cancel</v-icon>
-                        </v-flex>
-                      </v-layout>
-                    </div>
+                </v-flex>
+                <v-layout>
+                  <v-flex xs4 class="pt-4 subheading">
+                    <label class="right hidden-xs-only hidden-sm-only">Select Class:</label>
+                    <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Class:</label>
                   </v-flex>
-                  <v-flex xs12>
-                    <div v-for="(updateImage,index) in updates" :key="index">
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">You Tube Link Url:</label>
-                        </v-flex>
-                        <v-flex xs5 class="ml-3">
-                          <v-text-field
-                            v-model="updateImage.youTubeLink"
-                            label="Upload new you tube link url"
-                            type="text"
-                            name="link"
-                            required
-                          ></v-text-field>
-                        </v-flex>
-                        <v-flex xs2 class="pt-4">
-                          <v-icon @click="deleteUpdate(index)" v-if="index !=0">cancel</v-icon>
-                          <v-icon @click="update">add_circle</v-icon>
-                        </v-flex>
-                      </v-layout>
-                    </div>
+                  <v-flex xs8 sm5 class="ml-3">
+                    <v-select
+                      :items="addclass"
+                      label="Select Class"
+                      v-model="editedItem.classNum"
+                      item-text="classNum"
+                      item-value="_id"
+                      name="Select Class"
+                      required
+                    ></v-select>
                   </v-flex>
+                </v-layout>
+                <v-flex xs12>
                   <v-layout>
-                    <v-flex xs12 sm8 offset-sm2>
-                      <v-card-actions>
-                        <v-btn round dark @click.native="close">Cancel</v-btn>
-                        <v-spacer></v-spacer>
-                        <v-btn round dark @click="save">Save</v-btn>
-                      </v-card-actions>
+                    <v-flex xs4 class="pt-4 subheading">
+                      <label class="right hidden-xs-only hidden-sm-only">Add New Images:</label>
+                      <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Upload:</label>
+                    </v-flex>
+                    <v-flex xs8 sm5 class="ml-3">
+                      <v-text-field
+                        label="Select Image"
+                        @click="editPickFile"
+                        v-model="editImageName"
+                        append-icon="attach_file"
+                        multiple
+                      ></v-text-field>
                     </v-flex>
                   </v-layout>
-                </v-container>
-              </v-form>
+                </v-flex>
+              </v-layout>
+              <v-flex xs12>
+                <div
+                  v-for="(editImage,index) in editedItem.youTubeLinkUrl"
+                  :key="index"
+                  v-if="editImage.youTubeLink !=[]"
+                >
+                  <v-layout>
+                    <v-flex xs4 class="pt-4 subheading">
+                      <label class="right">You Tube Link Url:</label>
+                    </v-flex>
+                    <v-flex xs8 sm5 class="ml-3">
+                      <v-text-field
+                        v-model="editImage.youTubeLink"
+                        type="text"
+                        name="link"
+                        required
+                      ></v-text-field>
+                    </v-flex>
+                    <v-flex xs2 class="pt-4">
+                      <v-icon @click="deleteUrl(index,editImage._id,editedItem._id)">cancel</v-icon>
+                    </v-flex>
+                  </v-layout>
+                </div>
+              </v-flex>
+              <v-flex xs12>
+                <div v-for="(updateImage,index) in updates" :key="index">
+                  <v-layout>
+                    <v-flex xs4 class="pt-4 subheading">
+                      <label class="right">You Tube Url:</label>
+                    </v-flex>
+                    <v-flex xs5 sm5 class="ml-3">
+                      <v-text-field
+                        v-model="updateImage.youTubeLink"
+                        label="Upload new you tube link url"
+                        required
+                      ></v-text-field>
+                    </v-flex>
+                    <v-flex xs2 class="pt-4">
+                      <v-icon @click="deleteUpdate(index)" v-if="index !=0">cancel</v-icon>
+                      <v-icon @click="update">add_circle</v-icon>
+                    </v-flex>
+                  </v-layout>
+                </div>
+              </v-flex>
+              <v-layout>
+                <v-flex xs12 sm8 offset-sm2>
+                  <v-card-actions>
+                    <v-btn round dark @click.native="close">Cancel</v-btn>
+                    <v-spacer></v-spacer>
+                    <v-btn round dark @click="save">Save</v-btn>
+                  </v-card-actions>
+                </v-flex>
+              </v-layout>
+              <!-- </v-container>
+              </v-form>-->
             </v-card-text>
           </v-card>
         </v-dialog>
@@ -239,7 +236,7 @@
                 class="mt-4 pa-2"
                 v-if="editedItem.imageUrl"
               >
-                <img :src="image.imageLink" alt="Gallery" width="240" height="180" />
+                <img :src="image.imageLink" alt="Gallery" width="240" height="180" class="imgNews" />
               </span>
             </v-flex>
             <v-card-text>
@@ -364,7 +361,7 @@
                   <v-layout>
                     <v-flex
                       xs12
-                      class="text-xs-center text-sm-center text-md-center text-lg-center my-4 mr-4"
+                      class="text-xs-center text-sm-center text-md-center text-lg-center my-4"
                     >
                       <input
                         type="file"
@@ -376,7 +373,7 @@
                       />
                       <v-layout justify-center>
                         <v-flex v-for="(file,index) in files" :key="index" v-if="files">
-                          <img :src="file" height="160" width="160px;" />
+                          <img :src="file" height="160" width="160px;" class="imgNews" />
                         </v-flex>
                       </v-layout>
                       <img
@@ -384,6 +381,7 @@
                         v-if="files ==''"
                         height="140"
                         width="180px;"
+                        class="imgNews"
                       />
                     </v-flex>
                   </v-layout>
@@ -462,9 +460,9 @@
                       <div v-for="(youTubeLink,index) in finds" :key="index">
                         <v-layout>
                           <v-flex xs4 class="pt-4 subheading">
-                            <label class="right">You Tube Link Url:</label>
+                            <label class="right">You Tube Url:</label>
                           </v-flex>
-                          <v-flex xs8 sm4 class="ml-3">
+                          <v-flex xs6 sm4 class="ml-3">
                             <v-text-field
                               placeholder="fill your youtube link"
                               v-model="youTubeLink.value"
@@ -480,13 +478,18 @@
                         </v-layout>
                       </div>
                     </v-flex>
-                    <v-flex xs12 sm6 offset-sm3>
-                      <v-card-actions>
-                        <v-btn @click="clear" round dark>clear</v-btn>
-                        <v-spacer></v-spacer>
-                        <v-btn @click="submit" round dark :loading="loading">Add</v-btn>
-                      </v-card-actions>
-                    </v-flex>
+                    <v-layout>
+                      <v-flex xs12 sm5 offset-sm3>
+                        <v-layout>
+                          <v-flex xs6>
+                            <v-btn @click="clear" round class="ml-3" dark>clear</v-btn>
+                          </v-flex>
+                          <v-flex xs6>
+                            <v-btn @click="submit" round dark :loading="loading" class="right">Add</v-btn>
+                          </v-flex>
+                        </v-layout>
+                      </v-flex>
+                    </v-layout>
                   </v-layout>
                 </v-container>
               </v-form>
diff --git a/src/pages/Holiday/holiday.vue b/src/pages/Holiday/holiday.vue
index 1683203..0df8aac 100644
--- a/src/pages/Holiday/holiday.vue
+++ b/src/pages/Holiday/holiday.vue
@@ -38,69 +38,67 @@
               <v-spacer></v-spacer>
             </v-toolbar>
             <v-card flat>
-              <v-form ref="form">
-                <v-container fluid>
-                  <v-flex xs12 sm12>
-                    <v-layout>
-                      <v-flex xs4 class="pt-4 subheading">
-                        <label class="right">Occasion:</label>
-                      </v-flex>
-                      <v-flex xs8 sm5  class="ml-3">
+              <v-container fluid>
+                <v-flex xs12 sm12>
+                  <v-layout>
+                    <v-flex xs4 class="pt-4 subheading">
+                      <label class="right">Occasion:</label>
+                    </v-flex>
+                    <v-flex xs8 sm5 class="ml-3">
+                      <v-text-field
+                        v-model="editedItem.occasion"
+                        placeholder="fill your Occasion"
+                        name="name"
+                        type="text"
+                      ></v-text-field>
+                    </v-flex>
+                  </v-layout>
+                </v-flex>
+                <v-flex xs12 sm12>
+                  <v-layout>
+                    <v-flex xs4 class="pt-4 subheading">
+                      <label class="right">Date:</label>
+                    </v-flex>
+                    <v-flex xs8 sm5 class="ml-3">
+                      <v-menu
+                        ref="menu"
+                        :close-on-content-click="false"
+                        :return-value.sync="editedItem.dateOfHoliday"
+                        v-model="menu"
+                        :nudge-right="40"
+                        lazy
+                        transition="scale-transition"
+                        offset-y
+                        full-width
+                        min-width="290px"
+                      >
                         <v-text-field
-                          v-model="editedItem.occasion"
-                          placeholder="fill your Occasion"
-                          name="name"
-                          type="text"
+                          slot="activator"
+                          :rules="dateRules"
+                          v-model="editedItem.dateOfHoliday"
+                          append-icon="event"
+                          placeholder="Select date"
                         ></v-text-field>
-                      </v-flex>
-                    </v-layout>
-                  </v-flex>
-                  <v-flex xs12 sm12>
-                    <v-layout>
-                      <v-flex xs4 class="pt-4 subheading">
-                        <label class="right">Date:</label>
-                      </v-flex>
-                      <v-flex xs8 sm5 class="ml-3">
-                        <v-menu
-                          ref="menu"
-                          :close-on-content-click="false"
-                          :return-value.sync="editedItem.dateOfHoliday"
-                          v-model="menu"
-                          :nudge-right="40"
-                          lazy
-                          transition="scale-transition"
-                          offset-y
-                          full-width
-                          min-width="290px"
-                        >
-                          <v-text-field
-                            slot="activator"
-                            :rules="dateRules"
-                            v-model="editedItem.dateOfHoliday"
-                            append-icon="event"
-                            placeholder="Select date"
-                          ></v-text-field>
-                          <v-date-picker
-                            ref="picker"
-                            color="info"
-                            v-model="editedItem.dateOfHoliday"
-                            @input="menu = false"
-                          ></v-date-picker>
-                        </v-menu>
-                      </v-flex>
-                    </v-layout>
-                  </v-flex>
-                  <v-layout>
-                    <v-flex xs12 sm10 offset-sm1>
-                      <v-card-actions>
-                        <v-btn round dark @click.native="close">Cancel</v-btn>
-                        <v-spacer></v-spacer>
-                        <v-btn round dark @click="save">Save</v-btn>
-                      </v-card-actions>
+                        <v-date-picker
+                          ref="picker"
+                          color="info"
+                          v-model="editedItem.dateOfHoliday"
+                          @input="menu = false"
+                        ></v-date-picker>
+                      </v-menu>
                     </v-flex>
                   </v-layout>
-                </v-container>
-              </v-form>
+                </v-flex>
+                <v-layout>
+                  <v-flex xs12 sm10 offset-sm1>
+                    <v-card-actions>
+                      <v-btn round dark @click.native="close">Cancel</v-btn>
+                      <v-spacer></v-spacer>
+                      <v-btn round dark @click="save">Save</v-btn>
+                    </v-card-actions>
+                  </v-flex>
+                </v-layout>
+              </v-container>
             </v-card>
           </v-flex>
         </v-dialog>
@@ -165,7 +163,7 @@
           :search="search"
         >
           <template slot="items" slot-scope="props">
-            <td id="td" class="text-xs-center">{{ props.index  + 1}}</td>
+            <td id="td" class="text-xs-center">{{ props.index + 1}}</td>
             <td id="td" class="text-xs-center">{{ props.item.occasion}}</td>
             <td id="td" class="text-xs-center">{{ dates(props.item.dateOfHoliday) }}</td>
 
@@ -268,13 +266,15 @@
                       </v-flex>
                     </v-layout>
                   </v-flex>
-                  <v-layout>
                     <v-flex xs12 sm7 offset-sm2>
-                      <v-card-actions>
-                        <v-btn @click="clear" round dark>clear</v-btn>
-                        <v-spacer></v-spacer>
-                        <v-btn @click="submit" round dark :loading="loading">Add</v-btn>
-                      </v-card-actions>
+                      <v-layout>
+                        <v-flex xs6>
+                          <v-btn @click="clear" round class="ml-3" dark>clear</v-btn>
+                        </v-flex>
+                        <v-flex xs6>
+                          <v-btn @click="submit" round dark :loading="loading" class="right">Add</v-btn>
+                        </v-flex>
+                      </v-layout>
                     </v-flex>
                   </v-layout>
                 </v-container>
diff --git a/src/pages/Library/member.vue b/src/pages/Library/member.vue
index 8ea7993..d93ff1c 100644
--- a/src/pages/Library/member.vue
+++ b/src/pages/Library/member.vue
@@ -425,7 +425,6 @@
       </v-toolbar>
       <v-card>
         <v-card-text>
-          <v-container>
             <v-layout wrap justify-center>
               <v-flex xs12 sm12 md10>
                 <v-form ref="form" v-model="valid" lazy-validation>
@@ -463,21 +462,18 @@
                 </v-form>
               </v-flex>
             </v-layout>
-          </v-container>
         </v-card-text>
       </v-card>
     </v-dialog>
     <!-- ****** EXISTING MEMBER TABLE ****** -->
     <v-card flat>
+          <h4
+            class="text-xs-center pt-4 ml-2 hidden-lg-only hidden-xl-only hidden-md-only"
+          >Library Member</h4>
       <v-card-actions>
-        <v-layout>
-          <h3 class="right mt-2 ml-2">Library Member</h3>
-        </v-layout>
+          <h3 class="right mt-2 ml-2 hidden-sm-only hidden-xs-only">Library Member</h3>
         <v-spacer></v-spacer>
-        <v-flex xs12 sm1>
-          <!-- <label class="title">Select Class:</label> -->
-        </v-flex>
-        <v-flex xs12 sm2>
+        <v-flex xs12 sm4 md2>
           <v-select
             outline
             small
@@ -515,7 +511,6 @@
           <img
             v-if="!props.item.libraryId"
             style="cursor:pointer; width:25px; height:18px; "
-            class="mr-5"
             @click="addLibraryData(props.item)"
             src="/static/icon/add.png"
           />
@@ -653,12 +648,13 @@ export default {
       let deleteStudentLibraryData = {
         studentId: item._id,
         libraryId: item.libraryId
-
       };
       http()
         .put(
           "/deleteLibrary",
-          confirm("Are you sure you want to delete this?") && deleteStudentLibraryData )
+          confirm("Are you sure you want to delete this?") &&
+            deleteStudentLibraryData
+        )
         .then(response => {
           this.snackbar = true;
           this.text = "Delete Successfully";
diff --git a/src/pages/News/news.vue b/src/pages/News/news.vue
index 12af9ce..30cdc9e 100644
--- a/src/pages/News/news.vue
+++ b/src/pages/News/news.vue
@@ -17,7 +17,7 @@
         class="subheading"
       >Add News</v-tab>
 
-      <!-- ****** EDITS ALL NEWS DETAILS ****** -->
+      <!-- ****** EDIT NEWS  ****** -->
 
       <v-tab-item>
         <v-snackbar
@@ -38,118 +38,118 @@
               <v-spacer></v-spacer>
             </v-toolbar>
             <v-card-text style="height:600px;">
-              <v-form ref="form">
-                <v-container fluid>
-                  <v-layout row>
+              <!-- <v-form ref="form">
+              <v-container fluid>-->
+              <v-layout row>
+                <v-flex
+                  xs12
+                  class="text-xs-center text-sm-center text-md-center text-lg-center my-4"
+                >
+                  <input
+                    type="file"
+                    style="display: none"
+                    ref="image"
+                    accept="image/*"
+                    multiple
+                    @change="onFilePicked"
+                  />
+                  <v-layout justify-center>
                     <v-flex
                       xs12
-                      class="text-xs-center text-sm-center text-md-center text-lg-center my-4 mr-4"
+                      sm12
+                      md3
+                      v-for="Image in editedItem.newsImageUrl"
+                      :key="Image._id"
+                      v-if="editedItem.newsImageUrl"
+                      class="profile-image-wrapper"
                     >
-                      <input
-                        type="file"
-                        style="display: none"
-                        ref="image"
-                        accept="image/*"
-                        multiple
-                        @change="onFilePicked"
-                      />
-                      <v-layout justify-center>
-                        <v-flex
-                          xs3
-                          v-for="Image in editedItem.newsImageUrl"
-                          :key="Image._id"
-                          v-if="editedItem.newsImageUrl"
-                          class="profile-image-wrapper"
-                        >
-                          <img
-                            :src="Image.imageUrl"
-                            height="160"
-                            width="160"
-                            alt="News"
-                            class="pa-2"
-                          />
-                          <v-icon
-                            class="red edit-profile-icon"
-                            dark
-                            @click="deleteImage(Image._id,editedItem._id)"
-                          >close</v-icon>
-                        </v-flex>
-                        <v-flex v-for="(file, index) in files" :key="index">
-                          <img :src="file" height="160" width="160" class="pa-2" />
-                        </v-flex>
-                      </v-layout>
                       <img
-                        src="/static/icon/user.png"
-                        v-if="editedItem.newsImageUrl ==''"
+                        :src="Image.imageUrl"
                         height="160"
                         width="160"
                         alt="News"
+                        class="pa-2 imgNews"
                       />
+                      <v-icon
+                        class="red edit-profile-icon"
+                        dark
+                        @click="deleteImage(Image._id,editedItem._id)"
+                      >close</v-icon>
+                    </v-flex>
+                    <v-flex v-for="(file, index) in files" :key="index">
+                      <img :src="file" height="160" width="160" class="pa-2" />
                     </v-flex>
                   </v-layout>
-                  <!-- </v-layout> -->
+                  <img
+                    src="/static/icon/user.png"
+                    v-if="editedItem.newsImageUrl ==''"
+                    height="160"
+                    width="160"
+                    alt="News"
+                  />
+                </v-flex>
+              </v-layout>
+              <!-- </v-layout> -->
+              <v-layout wrap>
+                <v-flex xs12 sm12>
                   <v-layout>
-                    <v-flex xs12 sm12>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Title:</label>
-                        </v-flex>
-                        <v-flex sm5 xs8 class="ml-3">
-                          <v-text-field
-                            v-model="editedItem.title"
-                            placeholder="fill your Title"
-                            name="name"
-                            type="text"
-                            required
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
+                    <v-flex xs4 class="pt-4 subheading">
+                      <label class="right">Title:</label>
                     </v-flex>
-                    <v-flex xs12 sm12>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Description:</label>
-                        </v-flex>
-                        <v-flex sm5 xs8 class="ml-3">
-                          <v-text-field
-                            placeholder="fill your Description"
-                            v-model="editedItem.description"
-                            type="text"
-                            name="email"
-                            required
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
+                    <v-flex sm5 xs8 class="ml-3">
+                      <v-text-field
+                        v-model="editedItem.title"
+                        placeholder="fill your Title"
+                        name="name"
+                        type="text"
+                        required
+                      ></v-text-field>
                     </v-flex>
-                    <v-flex xs12>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right hidden-xs-only hidden-sm-only">Add New Images:</label>
-                        <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Uplaod :</label>
-                        </v-flex>
-                        <v-flex sm5 xs8 class="ml-3">
-                          <v-text-field
-                            label="Select Image"
-                            @click="pickFile"
-                            v-model="imageName"
-                            append-icon="attach_file"
-                            multiple
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
+                  </v-layout>
+                </v-flex>
+                <v-flex xs12 sm12>
+                  <v-layout>
+                    <v-flex xs4 class="pt-4 subheading">
+                      <label class="right">Description:</label>
+                    </v-flex>
+                    <v-flex sm5 xs8 class="ml-3">
+                      <v-text-field
+                        placeholder="fill your Description"
+                        v-model="editedItem.description"
+                        type="text"
+                        name="email"
+                        required
+                      ></v-text-field>
                     </v-flex>
                   </v-layout>
+                </v-flex>
+                <v-flex xs12>
                   <v-layout>
-                    <v-flex xs12 sm8 offset-sm2>
-                      <v-card-actions>
-                        <v-btn round dark @click.native="close">Cancel</v-btn>
-                        <v-spacer></v-spacer>
-                        <v-btn round dark @click="save">Save</v-btn>
-                      </v-card-actions>
+                    <v-flex xs4 class="pt-4 subheading">
+                      <label class="right hidden-xs-only hidden-sm-only">Add New Images:</label>
+                      <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Uplaod :</label>
+                    </v-flex>
+                    <v-flex sm5 xs8 class="ml-3">
+                      <v-text-field
+                        label="Select Image"
+                        @click="pickFile"
+                        v-model="imageName"
+                        append-icon="attach_file"
+                        multiple
+                      ></v-text-field>
                     </v-flex>
                   </v-layout>
-                </v-container>
-              </v-form>
+                </v-flex>
+              </v-layout>
+              <v-layout>
+                <v-flex xs12 sm8 offset-sm2>
+                  <v-card-actions>
+                    <v-btn round dark @click.native="close">Cancel</v-btn>
+                    <v-spacer></v-spacer>
+                    <v-btn round dark @click="save">Save</v-btn>
+                  </v-card-actions>
+                </v-flex>
+              </v-layout>
             </v-card-text>
           </v-card>
         </v-dialog>
@@ -167,11 +167,8 @@
               <v-icon @click="close1">close</v-icon>
             </v-toolbar>
             <v-flex align-center justify-center layout text-xs-center>
-              <!-- <v-avatar size="50px" style="position:absolute; top:20px;">
-                <img src="/static/icon/user.png">
-              </v-avatar>-->
               <span v-for="(image,i) in editedItem.newsImageUrl" :key="i" class="mt-4 pa-2">
-                <img :src="image.imageUrl" alt="News" width="240" height="180" />
+                <img :src="image.imageUrl" alt="News" width="240" height="180" class="imgNews" />
               </span>
             </v-flex>
             <v-card-text>
@@ -282,7 +279,7 @@
                   <v-layout>
                     <v-flex
                       xs12
-                      class="text-xs-center text-sm-center text-md-center text-lg-center my-4 mr-4"
+                      class="text-xs-center text-sm-center text-md-center text-lg-center my-4"
                     >
                       <input
                         type="file"
@@ -294,7 +291,7 @@
                       />
                       <v-layout justify-center>
                         <v-flex v-for="(file,index) in files" :key="index" v-if="files">
-                          <img :src="file" height="160" width="160px;" />
+                          <img :src="file" height="160" width="160px;" class="imgNews" />
                         </v-flex>
                       </v-layout>
                       <img
@@ -357,12 +354,15 @@
                     </v-layout>
                   </v-flex>
                   <v-layout>
-                    <v-flex xs12 sm6 offset-sm3>
-                      <v-card-actions>
-                        <v-btn @click="clear" round dark>clear</v-btn>
-                        <v-spacer></v-spacer>
-                        <v-btn @click="submit" round dark :loading="loading">Add</v-btn>
-                      </v-card-actions>
+                    <v-flex xs12 sm5 offset-sm3>
+                      <v-layout>
+                        <v-flex xs6>
+                          <v-btn @click="clear" round class="ml-3" dark>clear</v-btn>
+                        </v-flex>
+                        <v-flex xs6>
+                          <v-btn @click="submit" round dark :loading="loading" class="right">Add</v-btn>
+                        </v-flex>
+                      </v-layout>
                     </v-flex>
                   </v-layout>
                 </v-container>
diff --git a/src/pages/NoticeBoard/noticeBoard.vue b/src/pages/NoticeBoard/noticeBoard.vue
index e3d1b28..fcaf0cf 100644
--- a/src/pages/NoticeBoard/noticeBoard.vue
+++ b/src/pages/NoticeBoard/noticeBoard.vue
@@ -17,7 +17,7 @@
         class="subheading"
       >Add New Notice Board</v-tab>
 
-      <!-- ****** EDITS  Notice Board ****** -->
+      <!-- ****** Edit  Notice Board ****** -->
 
       <v-tab-item>
         <v-snackbar
@@ -29,7 +29,7 @@
           color="success"
         >{{ text }}</v-snackbar>
         <v-dialog v-model="dialog" max-width="640px" scrollable>
-          <v-card style="height: 540px;">
+          <v-card>
             <v-toolbar color="grey lighten-2" flat>
               <v-spacer></v-spacer>
               <v-toolbar-title>
@@ -38,98 +38,91 @@
               <v-spacer></v-spacer>
             </v-toolbar>
             <v-card-text>
-              <v-form ref="form">
-                <v-container fluid>
+              <v-layout>
+                <v-flex xs12 class="text-xs-center text-sm-center text-md-center text-lg-center">
+                  <img
+                    src="/static/icon/user.png"
+                    v-if="!editedItem.eventImageUrl && !imageUrl"
+                    width="150px"
+                  />
+                  <img
+                    :src="editedItem.eventImageUrl"
+                    height="150"
+                    v-else-if="editedItem.eventImageUrl && !imageUrl"
+                    width="180px"
+                  />
+                  <img
+                    v-if="imageUrl"
+                    :src="imageUrl"
+                    height="150"
+                    style="border-radius:50%; width:200px"
+                  />
+                  <input
+                    type="file"
+                    style="display: none"
+                    ref="image"
+                    accept="image/*"
+                    @change="onFilePicked"
+                  />
+                </v-flex>
+              </v-layout>
+              <v-layout wrap>
+                <v-flex xs12>
                   <v-layout>
-                    <v-flex
-                      xs12
-                      class="text-xs-center text-sm-center text-md-center text-lg-center"
-                    >
-                      <img
-                        src="/static/icon/user.png"
-                        v-if="!editedItem.eventImageUrl && !imageUrl"
-                        width="150px"
-                      />
-                      <img
-                        :src="editedItem.eventImageUrl"
-                        height="150"
-                        v-else-if="editedItem.eventImageUrl && !imageUrl"
-                        width="180px"
-                      />
-                      <img
-                        v-if="imageUrl"
-                        :src="imageUrl"
-                        height="150"
-                        style="border-radius:50%; width:200px"
-                      />
-                      <input
-                        type="file"
-                        style="display: none"
-                        ref="image"
-                        accept="image/*"
-                        @change="onFilePicked"
-                      />
+                    <v-flex xs4 class="pt-4 subheading">
+                      <label class="right">Title:</label>
+                    </v-flex>
+                    <v-flex xs6 class="ml-3">
+                      <v-text-field
+                        v-model="editedItem.title"
+                        placeholder="fill your Title"
+                        name="name"
+                        type="text"
+                        required
+                      ></v-text-field>
                     </v-flex>
                   </v-layout>
+                </v-flex>
+                <v-flex xs12>
                   <v-layout>
-                    <v-flex xs12>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Title:</label>
-                        </v-flex>
-                        <v-flex xs6 class="ml-3">
-                          <v-text-field
-                            v-model="editedItem.title"
-                            placeholder="fill your Title"
-                            name="name"
-                            type="text"
-                            required
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
+                    <v-flex xs4 class="pt-4 subheading">
+                      <label class="right">Description:</label>
                     </v-flex>
-                    <v-flex xs12>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Description:</label>
-                        </v-flex>
-                        <v-flex xs6 class="ml-3">
-                          <v-text-field
-                            placeholder="fill your Description"
-                            v-model="editedItem.description"
-                            type="text"
-                            name="email"
-                            required
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
+                    <v-flex xs6 class="ml-3">
+                      <v-text-field
+                        placeholder="fill your Description"
+                        v-model="editedItem.description"
+                        type="text"
+                        name="email"
+                        required
+                      ></v-text-field>
                     </v-flex>
-                    <v-flex xs12>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                           <label class="right hidden-xs-only hidden-sm-only">Uplaod Image:</label>
-                          <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Uplaod :</label>
-                        </v-flex>
-                        <v-flex xs6 class="ml-3">
-                          <v-text-field
-                            label="Select Image"
-                            @click="pickFile"
-                            v-model="imageName"
-                            append-icon="attach_file"
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
+                  </v-layout>
+                </v-flex>
+                <v-flex xs12>
+                  <v-layout>
+                    <v-flex xs4 class="pt-4 subheading">
+                      <label class="right hidden-xs-only hidden-sm-only">Uplaod Image:</label>
+                      <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Uplaod :</label>
                     </v-flex>
-                    <v-flex xs12 sm9 offset-sm2>
-                      <v-card-actions>
-                        <v-btn round dark @click.native="close">Cancel</v-btn>
-                        <v-spacer></v-spacer>
-                        <v-btn round dark @click="save">Save</v-btn>
-                      </v-card-actions>
+                    <v-flex xs6 class="ml-3">
+                      <v-text-field
+                        label="Select Image"
+                        @click="pickFile"
+                        v-model="imageName"
+                        append-icon="attach_file"
+                      ></v-text-field>
                     </v-flex>
                   </v-layout>
-                </v-container>
-              </v-form>
+                </v-flex>
+                <v-flex xs12 sm9 offset-sm2>
+                  <v-card-actions>
+                    <v-btn round dark @click.native="close">Cancel</v-btn>
+                    <v-spacer></v-spacer>
+                    <v-btn round dark @click="save">Save</v-btn>
+                  </v-card-actions>
+                </v-flex>
+              </v-layout>
             </v-card-text>
           </v-card>
         </v-dialog>
@@ -137,7 +130,7 @@
         <!-- ****** VIEW PROFIL NOTICE BOARD ******  -->
 
         <v-dialog v-model="dialog1" max-width="640px" scrollable>
-          <v-card style="height: 380px;">
+          <v-card>
             <v-toolbar color="grey lighten-2" flat>
               <v-spacer></v-spacer>
               <v-toolbar-title>
@@ -147,20 +140,25 @@
               <v-icon @click="close1">close</v-icon>
             </v-toolbar>
             <v-card-text>
-              <v-flex align-center justify-center layout text-xs-center class="mt-3">
-                <img src="/static/icon/user.png" v-if="!editedItem.eventImageUrl" width="130px" />
-                <img
-                  :src="editedItem.eventImageUrl"
-                  v-else-if="editedItem.eventImageUrl"
-                  width="200px"
-                />
-              </v-flex>
+              <v-layout>
+                <v-flex align-center justify-center layout text-xs-center class="mt-2">
+                  <img src="/static/icon/user.png" v-if="!editedItem.eventImageUrl" width="130px" />
+                  <img
+                    :src="editedItem.eventImageUrl"
+                    v-else-if="editedItem.eventImageUrl"
+                    class="img"
+                    width="200"
+                  />
+                </v-flex>
+              </v-layout>
               <v-container grid-list-md>
                 <v-layout wrap>
                   <v-flex>
                     <v-layout>
                       <v-flex xs5 sm6>
-                        <h5 class="right my-1"><b>Title:</b></h5>
+                        <h5 class="right my-1">
+                          <b>Title:</b>
+                        </h5>
                       </v-flex>
                       <v-flex sm6 xs8>
                         <h5 class="my-1">{{ editedItem.title }}</h5>
@@ -168,7 +166,9 @@
                     </v-layout>
                     <v-layout>
                       <v-flex xs5 sm6>
-                        <h5 class="right my-1"><b>Description:</b></h5>
+                        <h5 class="right my-1">
+                          <b>Description:</b>
+                        </h5>
                       </v-flex>
                       <v-flex sm6 xs8>
                         <h5 class="my-1">{{ editedItem.description }}</h5>
@@ -199,7 +199,7 @@
           :search="search"
         >
           <template slot="items" slot-scope="props">
-            <td id="td" class="text-xs-center">{{ props.index  + 1}}</td>
+            <td id="td" class="text-xs-center">{{ props.index + 1}}</td>
             <td id="td" class="text-xs-center">{{ props.item.title}}</td>
             <td id="td" class="text-xs-center">{{ props.item.description}}</td>
 
diff --git a/src/pages/Notification/notification.vue b/src/pages/Notification/notification.vue
index 27d0e73..dbbce05 100644
--- a/src/pages/Notification/notification.vue
+++ b/src/pages/Notification/notification.vue
@@ -37,72 +37,45 @@
               </v-toolbar-title>
               <v-spacer></v-spacer>
             </v-toolbar>
-            <v-card flat>
-              <v-form ref="form">
-                <v-container fluid>
-                  <v-layout>
-                    <v-flex
-                      xs12
-                      class="text-xs-center text-sm-center text-md-center text-lg-center mr-4"
-                    >
-                      <v-avatar size="100px">
-                        <img src="/static/icon/user.png" v-if="!imageUrl" />
-                      </v-avatar>
-                      <input
-                        type="file"
-                        style="display: none"
-                        ref="image"
-                        accept="image/*"
-                        @change="onFilePicked"
-                      />
-                      <img
-                        :src="imageData.imageUrl"
-                        height="150"
-                        v-if="imageUrl"
-                        style="border-radius:50%; width:200px"
-                      />
-                    </v-flex>
-                  </v-layout>
-                  <v-flex xs12 sm12>
-                    <v-layout>
-                      <v-flex xs4 class="pt-4 subheading">
-                        <label class="right">Title:</label>
-                      </v-flex>
-                      <v-flex xs8 sm5  class="ml-3">
-                        <v-text-field
-                          v-model="editedItem.title"
-                          placeholder="fill your Title"
-                          name="name"
-                          type="text"
-                        ></v-text-field>
-                      </v-flex>
-                    </v-layout>
+            <v-card flat class="pa-3">
+              <v-flex xs12 sm12>
+                <v-layout>
+                  <v-flex xs4 class="pt-4 subheading">
+                    <label class="right">Title:</label>
                   </v-flex>
-                  <v-flex xs12 sm12>
-                    <v-layout>
-                      <v-flex xs4 class="pt-4 subheading">
-                        <label class="right">Description:</label>
-                      </v-flex>
-                      <v-flex xs8 sm5 class="ml-3">
-                        <v-text-field
-                          placeholder="fill your Description"
-                          v-model="editedItem.description"
-                          type="text"
-                        ></v-text-field>
-                      </v-flex>
-                    </v-layout>
+                  <v-flex xs8 sm5 class="ml-3">
+                    <v-text-field
+                      v-model="editedItem.title"
+                      placeholder="fill your Title"
+                      name="name"
+                      type="text"
+                    ></v-text-field>
                   </v-flex>
-                  <v-layout>
-                    <v-flex xs12 sm10 offset-sm1>
-                      <v-card-actions>
-                        <v-btn round dark @click.native="close">Cancel</v-btn>
-                        <v-spacer></v-spacer>
-                        <v-btn round dark @click="save">Save</v-btn>
-                      </v-card-actions>
-                    </v-flex>
-                  </v-layout>
-                </v-container>
-              </v-form>
+                </v-layout>
+              </v-flex>
+              <v-flex xs12 sm12>
+                <v-layout>
+                  <v-flex xs4 class="pt-4 subheading">
+                    <label class="right">Description:</label>
+                  </v-flex>
+                  <v-flex xs8 sm5 class="ml-3">
+                    <v-text-field
+                      placeholder="fill your Description"
+                      v-model="editedItem.description"
+                      type="text"
+                    ></v-text-field>
+                  </v-flex>
+                </v-layout>
+              </v-flex>
+              <v-layout>
+                <v-flex xs12 sm10 offset-sm1>
+                  <v-card-actions>
+                    <v-btn round dark @click.native="close">Cancel</v-btn>
+                    <v-spacer></v-spacer>
+                    <v-btn round dark @click="save">Save</v-btn>
+                  </v-card-actions>
+                </v-flex>
+              </v-layout>
             </v-card>
           </v-flex>
         </v-dialog>
@@ -119,34 +92,31 @@
             <v-icon @click="close1">close</v-icon>
           </v-toolbar>
           <v-card>
-            <v-flex align-center justify-center layout text-xs-center>
-              <v-avatar size="50px" style="position:absolute; top:20px;">
-                <img src="/static/icon/user.png" />
-              </v-avatar>
-            </v-flex>
             <v-card-text>
               <v-container grid-list-md>
                 <v-layout wrap>
-                  <v-flex>
-                    <br />
-                    <br />
+                  <v-flex xs12>
                     <v-layout>
-                      <v-flex xs5 sm6>
-                        <h5 class="right my-1"><b>Title:</b></h5>
+                      <v-flex xs4 sm6>
+                        <h5 class="right my-1">
+                          <b>Title:</b>
+                        </h5>
                       </v-flex>
                       <v-flex sm6 xs8>
                         <h5 class="my-1">{{ editedItem.title }}</h5>
                       </v-flex>
                     </v-layout>
-                    <v-layout>
-                      <v-flex xs5 sm6>
-                        <h5 class="right my-1"><b>Description:</b></h5>
-                      </v-flex>
-                      <v-flex sm6 xs8>
-                        <h5 class="my-1">{{ editedItem.description }}</h5>
-                      </v-flex>
-                    </v-layout>
                   </v-flex>
+                  <v-layout>
+                    <v-flex xs4 sm6>
+                      <h5 class="right my-1">
+                        <b>Description:</b>
+                      </h5>
+                    </v-flex>
+                    <v-flex sm6 xs8>
+                      <h5 class="my-1">{{ editedItem.description }}</h5>
+                    </v-flex>
+                  </v-layout>
                 </v-layout>
               </v-container>
             </v-card-text>
@@ -170,7 +140,7 @@
           :search="search"
         >
           <template slot="items" slot-scope="props">
-            <td id="td" class="text-xs-center">{{ props.index  + 1}}</td>
+            <td id="td" class="text-xs-center">{{ props.index + 1}}</td>
             <td id="td" class="text-xs-center">{{ props.item.title}}</td>
             <td id="td" class="text-xs-center">{{ props.item.description}}</td>
 
@@ -218,39 +188,16 @@
             v-model="snackbar"
             color="success"
           >{{ text }}</v-snackbar>
-          <v-flex xs12 sm12 class="my-4">
+          <v-flex xs12 sm8 class="top" offset-sm2>
             <v-card flat>
               <v-form ref="form" v-model="valid" lazy-validation>
-                <v-container fluid>
-                  <v-layout>
-                    <v-flex
-                      xs12
-                      class="text-xs-center text-sm-center text-md-center text-lg-center my-4 mr-4"
-                    >
-                      <v-avatar size="100px">
-                        <img src="/static/icon/user.png" v-if="!imageUrl" />
-                      </v-avatar>
-                      <input
-                        type="file"
-                        style="display: none"
-                        ref="image"
-                        accept="image/*"
-                        @change="onFilePicked"
-                      />
-                      <img
-                        :src="imageData.imageUrl"
-                        height="150"
-                        v-if="imageUrl"
-                        style="border-radius:50%; width:200px"
-                      />
-                    </v-flex>
-                  </v-layout>
+                <v-container>
                   <v-flex xs12>
                     <v-layout>
                       <v-flex xs4 class="pt-4 subheading">
                         <label class="right">Title:</label>
                       </v-flex>
-                      <v-flex xs4 class="ml-3">
+                      <v-flex xs8 sm6 class="ml-3">
                         <v-text-field
                           v-model="addNotification.title"
                           placeholder="fill your Title"
@@ -266,7 +213,7 @@
                       <v-flex xs4 class="pt-4 subheading">
                         <label class="right">Description:</label>
                       </v-flex>
-                      <v-flex xs4 class="ml-3">
+                      <v-flex xs10 sm6 class="ml-3">
                         <v-text-field
                           placeholder="fill your Description"
                           :rules="descriptionRules"
@@ -277,13 +224,16 @@
                       </v-flex>
                     </v-layout>
                   </v-flex>
-                  <v-layout>
-                    <v-flex xs12 sm6 offset-sm3>
-                      <v-card-actions>
-                        <v-btn @click="clear" round dark>clear</v-btn>
-                        <v-spacer></v-spacer>
-                        <v-btn @click="submit" round dark :loading="loading">Add</v-btn>
-                      </v-card-actions>
+                   <v-layout>
+                    <v-flex xs12 sm9 offset-sm2>
+                      <v-layout>
+                        <v-flex xs6>
+                          <v-btn @click="clear" round class="ml-3" dark>clear</v-btn>
+                        </v-flex>
+                        <v-flex xs6>
+                          <v-btn @click="submit" round dark :loading="loading" class="right">Add</v-btn>
+                        </v-flex>
+                      </v-layout>
                     </v-flex>
                   </v-layout>
                 </v-container>
diff --git a/src/pages/Parent/parents.vue b/src/pages/Parent/parents.vue
index 47e0648..ffb9db7 100644
--- a/src/pages/Parent/parents.vue
+++ b/src/pages/Parent/parents.vue
@@ -28,47 +28,154 @@
           v-model="snackbar"
           color="success"
         >{{ text }}</v-snackbar>
-        <v-dialog v-model="dialog" max-width="700px" scrollable>
+        <v-dialog v-model="dialog" max-width="600px" scrollable>
           <v-card flat>
             <v-toolbar color="grey lighten-2" flat>
               <v-spacer></v-spacer>
               <v-toolbar-title>
-                <h3>Edit Parent Profile</h3>
+                <h3 class="hidden-xs-only">Edit Parent Profile</h3>
+                <h5
+                  class="hidden-sm-only hidden-md-only hidden-lg-only hidden-xl-only"
+                >Edit Parent Profile</h5>
               </v-toolbar-title>
               <v-spacer></v-spacer>
-              <v-icon @click="close">close</v-icon>
+              <v-icon @click="close" class="hidden-xs-only pr-2">close</v-icon>
+              <v-icon
+                @click="close"
+                size="26"
+                class="hidden-sm-only hidden-md-only hidden-lg-only hidden-xl-only"
+              >close</v-icon>
             </v-toolbar>
             <v-card-text style="height: 410px;">
-              <v-form ref="form">
-                <v-container fluid>
+              <v-flex xs12>
+                <v-layout>
+                  <v-flex xs3 sm4 class="pt-4 subheading">
+                    <label class="right">Email ID:</label>
+                  </v-flex>
+                  <v-flex xs8 sm6 class="ml-3">
+                    <v-text-field
+                      placeholder="fill your email"
+                      v-model="editedItem.email"
+                      type="text"
+                      name="email"
+                      required
+                    ></v-text-field>
+                  </v-flex>
+                </v-layout>
+              </v-flex>
+              <v-flex xs12>
+                <v-layout>
+                  <v-flex xs3 sm4 class="pt-4 subheading">
+                    <label class="right">Father Name:</label>
+                  </v-flex>
+                  <v-flex xs8 sm6 class="ml-3">
+                    <v-text-field
+                      v-model="editedItem.fatherName"
+                      placeholder="fill your father Name"
+                      required
+                    ></v-text-field>
+                  </v-flex>
+                </v-layout>
+              </v-flex>
+              <v-flex xs12>
+                <v-layout>
+                  <v-flex xs3 sm4 class="pt-4 subheading">
+                    <label class="right">Father Cell No:</label>
+                  </v-flex>
+                  <v-flex xs8 sm6 class="ml-3">
+                    <v-text-field
+                      v-model="editedItem.fatherCellNo"
+                      placeholder="fill your father Cell Number"
+                      type="number"
+                      required
+                    ></v-text-field>
+                  </v-flex>
+                </v-layout>
+              </v-flex>
+              <v-flex xs12>
+                <v-layout>
+                  <v-flex xs3 sm4 class="pt-4 subheading">
+                    <label class="right">Mother Name:</label>
+                  </v-flex>
+                  <v-flex xs8 sm6 class="ml-3">
+                    <v-text-field
+                      v-model="editedItem.motherName"
+                      placeholder="fill your Mother Name"
+                      type="text"
+                      required
+                    ></v-text-field>
+                  </v-flex>
+                </v-layout>
+              </v-flex>
+              <v-flex xs12>
+                <v-layout>
+                  <v-flex xs3 sm4 class="pt-4 subheading">
+                    <label class="right">Mother Cell No:</label>
+                  </v-flex>
+                  <v-flex xs8 sm6 class="ml-3">
+                    <v-text-field
+                      v-model="editedItem.motherCellNo"
+                      placeholder="fill your  Mother Cell Number"
+                      type="number"
+                      required
+                    ></v-text-field>
+                  </v-flex>
+                </v-layout>
+              </v-flex>
+              <v-layout>
+                <v-flex xs12 sm12>
+                  <v-card-actions>
+                    <v-spacer></v-spacer>
+                    <v-btn round dark @click="save">Save</v-btn>
+                    <v-spacer></v-spacer>
+                  </v-card-actions>
+                </v-flex>
+              </v-layout>
+              <!-- </v-container>
+              </v-form>-->
+            </v-card-text>
+          </v-card>
+        </v-dialog>
+
+        <!-- ****** PROFILE VIEW Parents DEATILS ******  -->
+
+        <v-dialog v-model="dialog1" max-width="600px" scrollable>
+          <v-card>
+            <v-toolbar color="grey lighten-2" flat>
+              <v-spacer></v-spacer>
+              <v-toolbar-title>Parent Profile</v-toolbar-title>
+              <v-spacer></v-spacer>
+              <v-icon @click="close1">close</v-icon>
+            </v-toolbar>
+            <v-container grid-list-md>
+              <v-layout wrap>
+                <v-flex xs12>
                   <v-layout>
-                    <v-flex xs12>
+                    <v-flex xs12 sm12>
                       <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Email ID:</label>
+                        <v-flex xs6>
+                          <h5 class="right my-1">
+                            <b>Email:</b>
+                          </h5>
                         </v-flex>
-                        <v-flex xs8 class="ml-3">
-                          <v-text-field
-                            placeholder="fill your email"
-                            v-model="editedItem.email"
-                            type="text"
-                            name="email"
-                            required
-                          ></v-text-field>
+                        <v-flex xs6>
+                          <h5 class="my-1">{{ editedItem.email }}</h5>
                         </v-flex>
                       </v-layout>
                     </v-flex>
+                  </v-layout>
+                  <v-layout>
                     <v-flex xs12>
                       <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Father Name:</label>
+                        <v-flex xs6>
+                          <b>
+                            <h5 class="right my-1">
+                              <b>Fahter Name:</b>
+                            </h5>
+                          </b>
                         </v-flex>
-                        <v-flex xs8 class="ml-3">
-                          <v-text-field
-                            v-model="editedItem.fatherName"
-                            placeholder="fill your father Name"
-                            required
-                          ></v-text-field>
+                        <v-flex xs6>
+                          <h5 class="my-1">{{ editedItem.fatherName }}</h5>
                         </v-flex>
                       </v-layout>
                     </v-flex>
@@ -76,166 +183,54 @@
                   <v-layout>
                     <v-flex xs12>
                       <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Father Cell No:</label>
+                        <v-flex xs6>
+                          <b>
+                            <h5 class="right my-1">
+                              <b>Mother Name:</b>
+                            </h5>
+                          </b>
                         </v-flex>
-                        <v-flex xs8 class="ml-3">
-                          <v-text-field
-                            v-model="editedItem.fatherCellNo"
-                            placeholder="fill your father Cell Number"
-                            type="number"
-                            required
-                          ></v-text-field>
+                        <v-flex xs6>
+                          <h5 class="my-1">{{ editedItem.motherName }}</h5>
                         </v-flex>
                       </v-layout>
                     </v-flex>
+                  </v-layout>
+                  <v-layout>
                     <v-flex xs12>
                       <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Mother Name:</label>
+                        <v-flex sm6>
+                          <b>
+                            <h5 class="right my-1">
+                              <b>Father Cell No:</b>
+                            </h5>
+                          </b>
                         </v-flex>
-                        <v-flex xs8 class="ml-3">
-                          <v-text-field
-                            v-model="editedItem.motherName"
-                            placeholder="fill your Mother Name"
-                            type="text"
-                            required
-                          ></v-text-field>
+                        <v-flex sm6>
+                          <h5 class="my-1">{{ editedItem.fatherCellNo }}</h5>
                         </v-flex>
                       </v-layout>
                     </v-flex>
+                  </v-layout>
+                  <v-layout>
                     <v-flex xs12>
                       <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Mother Cell No:</label>
+                        <v-flex xs6>
+                          <b>
+                            <h5 class="right my-1">
+                              <b>Mother Cell No:</b>
+                            </h5>
+                          </b>
                         </v-flex>
-                        <v-flex xs8 class="ml-3">
-                          <v-text-field
-                            v-model="editedItem.motherCellNo"
-                            placeholder="fill your  Mother Cell Number"
-                            type="number"
-                            required
-                          ></v-text-field>
+                        <v-flex xs6>
+                          <h5 class="my-1">{{ editedItem.motherCellNo }}</h5>
                         </v-flex>
                       </v-layout>
                     </v-flex>
                   </v-layout>
-                  <v-layout>
-                    <v-flex xs12 sm12>
-                      <v-card-actions>
-                        <v-spacer></v-spacer>
-                        <v-btn round dark @click="save">Save</v-btn>
-                        <v-spacer></v-spacer>
-                      </v-card-actions>
-                    </v-flex>
-                  </v-layout>
-                </v-container>
-              </v-form>
-            </v-card-text>
-          </v-card>
-        </v-dialog>
-
-        <!-- ****** PROFILE VIEW Parents DEATILS ******  -->
-
-        <v-dialog v-model="dialog1" max-width="800px" scrollable>
-          <v-card>
-            <v-toolbar color="grey lighten-2" flat>
-              <v-spacer></v-spacer>
-              <v-toolbar-title>Parent Profile</v-toolbar-title>
-              <v-spacer></v-spacer>
-              <v-icon @click="close1">close</v-icon>
-            </v-toolbar>
-            <!-- <v-card-text style="height: 300px;"> -->
-              <!-- <v-flex align-center justify-center layout text-xs-center class="mt-3">
-                <v-avatar size="160px">
-                  <img src="/static/icon/user.png" v-if="!editedItem.profilePicUrl" />
-                  <img :src="editedItem.profilePicUrl" v-else-if="editedItem.profilePicUrl" />
-                </v-avatar>
-              </v-flex>-->
-              <v-container grid-list-md>
-                <v-layout wrap>
-                  <v-flex xs12>
-                    <v-layout>
-                      <v-flex xs12 sm12>
-                        <v-layout>
-                          <v-flex xs6>
-                            <h5 class="right my-1">
-                              <b>Email:</b>
-                            </h5>
-                          </v-flex>
-                          <v-flex xs6>
-                            <h5 class="my-1">{{ editedItem.email }}</h5>
-                          </v-flex>
-                        </v-layout>
-                      </v-flex>
-                    </v-layout>
-                    <v-layout>
-                      <v-flex xs12>
-                        <v-layout>
-                          <v-flex xs6>
-                            <b>
-                              <h5 class="right my-1">
-                                <b>Fahter Name:</b>
-                              </h5>
-                            </b>
-                          </v-flex>
-                          <v-flex xs6>
-                            <h5 class="my-1">{{ editedItem.fatherName }}</h5>
-                          </v-flex>
-                        </v-layout>
-                      </v-flex>
-                    </v-layout>
-                    <v-layout>
-                      <v-flex xs12>
-                        <v-layout>
-                          <v-flex xs6>
-                            <b>
-                              <h5 class="right my-1">
-                                <b>Mother Name:</b>
-                              </h5>
-                            </b>
-                          </v-flex>
-                          <v-flex xs6>
-                            <h5 class="my-1">{{ editedItem.motherName }}</h5>
-                          </v-flex>
-                        </v-layout>
-                      </v-flex>
-                    </v-layout>
-                    <v-layout>
-                      <v-flex xs12>
-                        <v-layout>
-                          <v-flex sm6>
-                            <b>
-                              <h5 class="right my-1">
-                                <b>Father Cell No:</b>
-                              </h5>
-                            </b>
-                          </v-flex>
-                          <v-flex sm6>
-                            <h5 class="my-1">{{ editedItem.fatherCellNo }}</h5>
-                          </v-flex>
-                        </v-layout>
-                      </v-flex>
-                    </v-layout>
-                    <v-layout>
-                      <v-flex xs12>
-                        <v-layout>
-                          <v-flex xs6>
-                            <b>
-                              <h5 class="right my-1">
-                                <b>Mother Cell No:</b>
-                              </h5>
-                            </b>
-                          </v-flex>
-                          <v-flex xs6>
-                            <h5 class="my-1">{{ editedItem.motherCellNo }}</h5>
-                          </v-flex>
-                        </v-layout>
-                      </v-flex>
-                    </v-layout>
-                  </v-flex>
-                </v-layout>
-              </v-container>
+                </v-flex>
+              </v-layout>
+            </v-container>
             <!-- </v-card-text> -->
           </v-card>
         </v-dialog>
@@ -257,7 +252,7 @@
           :search="search"
         >
           <template slot="items" slot-scope="props">
-            <td id="td" class="text-xs-center">{{ props.index  + 1}}</td>
+            <td id="td" class="text-xs-center">{{ props.index + 1}}</td>
             <td id="td" class="text-xs-center">{{ props.item.email }}</td>
             <td id="td" class="text-xs-center">{{ props.item.fatherName }}</td>
             <td id="td" class="text-xs-center">{{ props.item.fatherCellNo }}</td>
diff --git a/src/pages/Section/section.vue b/src/pages/Section/section.vue
index d625db6..5956acd 100644
--- a/src/pages/Section/section.vue
+++ b/src/pages/Section/section.vue
@@ -40,12 +40,12 @@
               <v-layout wrap justify-center>
                 <v-flex xs12 sm9>
                   <v-form>
-                    <v-layout style="position:relative;">
-                      <v-flex xs5 sm4 class="pt-4 subheading pl-3">
-                        <label class="right hidden-xs-only hidden-sm-only">Class Name:</label>
-                        <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Class:</label>
+                    <v-layout>
+                      <v-flex xs5 sm4 class="pt-4 subheading">
+                        <label class="pl-3">Class Name:</label>
+                        <!-- <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Class:</label> -->
                       </v-flex>
-                      <v-flex xs9 sm8>
+                      <v-flex xs7 sm8>
                         <v-select
                           :items="addclass"
                           :label="editedItem.classData.classNum"
@@ -56,7 +56,7 @@
                         ></v-select>
                       </v-flex>
                     </v-layout>
-                    <v-layout style="position:relative;">
+                    <v-layout>
                       <v-flex xs5 sm4 class="pt-4 subheading">
                         <label>Section Name:</label>
                       </v-flex>
@@ -68,7 +68,7 @@
                         ></v-autocomplete>
                       </v-flex>
                     </v-layout>
-                    <v-layout style="position:relative;">
+                    <v-layout>
                       <v-flex xs5 sm4 class="pt-4 subheading">
                         <label>Class Incharge:</label>
                       </v-flex>
diff --git a/src/pages/Students/students.vue b/src/pages/Students/students.vue
index a46000f..a6a7a90 100644
--- a/src/pages/Students/students.vue
+++ b/src/pages/Students/students.vue
@@ -37,7 +37,7 @@
               </v-toolbar-title>
               <v-spacer></v-spacer>
             </v-toolbar>
-            <v-card-text  style="height: 586px;">
+            <v-card-text style="height: 586px;">
               <v-form ref="form">
                 <v-container fluid>
                   <v-layout>
@@ -394,47 +394,6 @@
                       </v-layout>
                     </v-flex>
                   </v-layout>
-                  <!-- <v-layout>
-                    <v-flex xs12>
-                      <v-layout>
-                        <v-flex
-                          xs1
-                          class="pt-4 subheading"
-                          style="flex-basis: 13.333333% !important; max-width: 13.333333% !important;"
-                        >
-                          <label class="right">Present Address:</label>
-                        </v-flex>
-                        <v-flex xs11 class="ml-2">
-                          <v-text-field
-                            v-model="editedItem.presentAddress"
-                            placeholder="fill Your present Address"
-                            required
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
-                    </v-flex>
-                  </v-layout>
-                  <v-layout>
-                    <v-flex xs12>
-                      <v-layout>
-                        <v-flex
-                          xs1
-                          class="pt-4 subheading"
-                          style="flex-basis: 13.333333% !important; max-width: 13.333333% !important;"
-                        >
-                          <label class="right">Permanent Address:</label>
-                        </v-flex>
-                        <v-flex xs11 class="ml-2">
-                          <v-textarea
-                            rows="1"
-                            v-model="editedItem.permanentAddress"
-                            placeholder="fill Your Permanent Address"
-                            required
-                          ></v-textarea>
-                        </v-flex>
-                      </v-layout>
-                    </v-flex>
-                  </v-layout>-->
                   <v-layout class="hidden-xs-only hidden-sm-only">
                     <v-flex xs12 sm12>
                       <v-layout>
@@ -507,7 +466,7 @@
                     <v-flex xs12 sm12>
                       <v-layout>
                         <v-flex xs6>
-                           <v-btn round dark @click.native="close">Cancel</v-btn>
+                          <v-btn round dark @click.native="close">Cancel</v-btn>
                         </v-flex>
                         <v-flex xs6>
                           <v-btn @click="save" round dark :loading="loading" class="right">Save</v-btn>
@@ -524,7 +483,7 @@
         <!-- ****** PROFILE VIEW STUDENTS DEATILS ******  -->
 
         <v-dialog v-model="dialog1" max-width="1100px" scrollable>
-          <v-card >
+          <v-card>
             <v-toolbar color="grey lighten-2" flat>
               <v-spacer></v-spacer>
               <v-toolbar-title>Student Profile</v-toolbar-title>
@@ -540,346 +499,358 @@
               </v-flex>
               <v-container grid-list-md>
                 <v-layout wrap>
-                  <v-flex xs12>
-                    <v-layout wrap>
-                      <v-flex xs12 sm6>
-                        <v-layout>
-                          <v-flex xs6 sm5>
-                            <h5 class="right my-1">
-                              <b>Full Name:</b>
-                            </h5>
-                          </v-flex>
-                          <v-flex sm7 xs6>
-                            <h5 class="my-1 left">{{ editedItem.name }}</h5>
-                          </v-flex>
-                        </v-layout>
+                  <v-flex xs12 sm6>
+                    <v-layout>
+                      <v-flex xs6 sm5>
+                        <h5 class="right my-1">
+                          <b>Full Name:</b>
+                        </h5>
                       </v-flex>
-                      <v-flex xs12 sm6>
-                        <v-layout>
-                          <v-flex xs6 sm4>
-                            <h5 class="right my-1">
-                              <b>Email:</b>
-                            </h5>
-                          </v-flex>
-                          <v-flex sm8 xs6>
-                            <h5 class="my-1 left">{{ editedItem.email }}</h5>
-                          </v-flex>
-                        </v-layout>
+                      <v-flex sm7 xs6>
+                        <h5 class="my-1 left">{{ editedItem.name }}</h5>
                       </v-flex>
                     </v-layout>
-                    <v-layout wrap>
-                      <v-flex xs12 sm6>
-                        <v-layout>
-                          <v-flex xs6 sm5>
-                            <b>
-                              <h5 class="right my-1">
-                                <b>Gender:</b>
-                              </h5>
-                            </b>
-                          </v-flex>
-                          <v-flex sm7 xs6>
-                            <h5 class="my-1 left">{{ editedItem.gender }}</h5>
-                          </v-flex>
-                        </v-layout>
+                  </v-flex>
+                  <v-flex xs12 sm6>
+                    <v-layout>
+                      <v-flex xs6 sm4>
+                        <h5 class="right my-1">
+                          <b>Email:</b>
+                        </h5>
                       </v-flex>
-                      <v-flex xs12 sm6>
-                        <v-layout>
-                          <v-flex xs6 sm4>
-                            <b>
-                              <h5 class="right my-1">
-                                <b>D.O.B:</b>
-                              </h5>
-                            </b>
-                          </v-flex>
-                          <v-flex sm7 xs6>
-                            <h5 class="my-1">{{ dates(editedItem.dob) }}</h5>
-                          </v-flex>
-                        </v-layout>
+                      <v-flex sm8 xs6>
+                        <h5 class="my-1 left">{{ editedItem.email }}</h5>
                       </v-flex>
                     </v-layout>
-                    <v-layout wrap>
-                      <v-flex xs12 sm6>
-                        <v-layout>
-                          <v-flex xs6 sm5>
-                            <b>
-                              <h5 class="right my-1">
-                                <b>Blood Group:</b>
-                              </h5>
-                            </b>
-                          </v-flex>
-                          <v-flex sm7 xs6>
-                            <h5 class="my-1 left">{{ editedItem.bloodGroup }}</h5>
-                          </v-flex>
-                        </v-layout>
+                  </v-flex>
+                </v-layout>
+                <v-layout wrap>
+                  <v-flex xs12 sm6>
+                    <v-layout>
+                      <v-flex xs6 sm5>
+                        <b>
+                          <h5 class="right my-1">
+                            <b>Gender:</b>
+                          </h5>
+                        </b>
                       </v-flex>
-                      <v-flex xs12 sm6>
-                        <v-layout>
-                          <v-flex xs6 sm4>
-                            <b>
-                              <h5 class="right my-1">
-                                <b>Allergies:</b>
-                              </h5>
-                            </b>
-                          </v-flex>
-                          <v-flex sm8 xs6>
-                            <h5 class="my-1">{{ editedItem.allergies }}</h5>
-                          </v-flex>
-                        </v-layout>
+                      <v-flex sm7 xs6>
+                        <h5 class="my-1 left">{{ editedItem.gender }}</h5>
                       </v-flex>
                     </v-layout>
-                    <v-layout wrap>
-                      <v-flex xs12 sm6>
-                        <v-layout>
-                          <v-flex xs6 sm5>
-                            <b>
-                              <h5 class="right my-1">
-                                <b>Height:</b>
-                              </h5>
-                            </b>
-                          </v-flex>
-                          <v-flex sm7 xs6>
-                            <h5 class="my-1 left">{{ editedItem.height }}</h5>
-                          </v-flex>
-                        </v-layout>
+                  </v-flex>
+                  <v-flex xs12 sm6>
+                    <v-layout>
+                      <v-flex xs6 sm4>
+                        <b>
+                          <h5 class="right my-1">
+                            <b>D.O.B:</b>
+                          </h5>
+                        </b>
                       </v-flex>
-                      <v-flex xs12 sm6>
-                        <v-layout>
-                          <v-flex xs6 sm4>
-                            <b>
-                              <h5 class="right my-1">
-                                <b>Weight:</b>
-                              </h5>
-                            </b>
-                          </v-flex>
-                          <v-flex sm8 xs6>
-                            <h5 class="my-1">{{ editedItem.weight }}</h5>
-                          </v-flex>
-                        </v-layout>
+                      <v-flex sm7 xs6>
+                        <h5 class="my-1">{{ dates(editedItem.dob) }}</h5>
                       </v-flex>
                     </v-layout>
-                    <v-layout wrap>
-                      <v-flex xs12 sm6>
-                        <v-layout>
-                          <v-flex xs6 sm5>
-                            <b>
-                              <h5 class="right my-1">
-                                <b>City:</b>
-                              </h5>
-                            </b>
-                          </v-flex>
-                          <v-flex sm7 xs6>
-                            <h5 class="my-1 left">{{ editedItem.city }}</h5>
-                          </v-flex>
-                        </v-layout>
+                  </v-flex>
+                </v-layout>
+                <v-layout wrap>
+                  <v-flex xs12 sm6>
+                    <v-layout>
+                      <v-flex xs6 sm5>
+                        <b>
+                          <h5 class="right my-1">
+                            <b>Blood Group:</b>
+                          </h5>
+                        </b>
                       </v-flex>
-                      <v-flex xs12 sm6>
-                        <v-layout>
-                          <v-flex xs6 sm4>
-                            <b>
-                              <h5 class="right my-1">
-                                <b>State:</b>
-                              </h5>
-                            </b>
-                          </v-flex>
-                          <v-flex sm8 xs6>
-                            <h5 class="my-1">{{ editedItem.state }}</h5>
-                          </v-flex>
-                        </v-layout>
+                      <v-flex sm7 xs6>
+                        <h5 class="my-1 left">{{ editedItem.bloodGroup }}</h5>
                       </v-flex>
                     </v-layout>
-                    <v-layout wrap>
-                      <v-flex xs12 sm6>
-                        <v-layout>
-                          <v-flex xs6 sm5>
-                            <b>
-                              <h5 class="right my-1">
-                                <b>Pincode:</b>
-                              </h5>
-                            </b>
-                          </v-flex>
-                          <v-flex sm7 xs6>
-                            <h5 class="my-1">{{ editedItem.pincode }}</h5>
-                          </v-flex>
-                        </v-layout>
+                  </v-flex>
+                  <v-flex xs12 sm6>
+                    <v-layout>
+                      <v-flex xs6 sm4>
+                        <b>
+                          <h5 class="right my-1">
+                            <b>Allergies:</b>
+                          </h5>
+                        </b>
                       </v-flex>
-                      <v-flex xs12 sm5>
-                        <v-layout>
-                          <v-flex xs6 sm5>
-                            <b>
-                              <h5 class="right my-1">
-                                <b>Country:</b>
-                              </h5>
-                            </b>
-                          </v-flex>
-                          <v-flex sm7 xs6>
-                            <h5 class="my-1">{{ editedItem.country }}</h5>
-                          </v-flex>
-                        </v-layout>
+                      <v-flex sm8 xs6>
+                        <h5 class="my-1">{{ editedItem.allergies }}</h5>
                       </v-flex>
                     </v-layout>
-                    <v-layout wrap>
-                      <v-flex xs12 sm6>
-                        <v-layout>
-                          <v-flex sm5 xs6>
-                            <b>
-                              <h5 class="right my-1">
-                                <b>Mobile No:</b>
-                              </h5>
-                            </b>
-                          </v-flex>
-                          <v-flex sm6 xs6>
-                            <h5 class="my-1">{{ editedItem.mobile }}</h5>
-                          </v-flex>
-                        </v-layout>
+                  </v-flex>
+                </v-layout>
+                <v-layout wrap>
+                  <v-flex xs12 sm6>
+                    <v-layout>
+                      <v-flex xs6 sm5>
+                        <b>
+                          <h5 class="right my-1">
+                            <b>Height:</b>
+                          </h5>
+                        </b>
                       </v-flex>
-                      <v-flex xs12 sm6>
-                        <v-layout>
-                          <v-flex xs6 sm4>
-                            <b>
-                              <h5 class="right my-1">
-                                <b>Fahter Name:</b>
-                              </h5>
-                            </b>
-                          </v-flex>
-                          <v-flex sm8 xs6>
-                            <h5 class="my-1">{{ editedItem.fatherName }}</h5>
-                          </v-flex>
-                        </v-layout>
+                      <v-flex sm7 xs6>
+                        <h5 class="my-1 left">{{ editedItem.height }}</h5>
+                      </v-flex>
+                    </v-layout>
+                  </v-flex>
+                  <v-flex xs12 sm6>
+                    <v-layout>
+                      <v-flex xs6 sm4>
+                        <b>
+                          <h5 class="right my-1">
+                            <b>Weight:</b>
+                          </h5>
+                        </b>
+                      </v-flex>
+                      <v-flex sm8 xs6>
+                        <h5 class="my-1">{{ editedItem.weight }}</h5>
+                      </v-flex>
+                    </v-layout>
+                  </v-flex>
+                </v-layout>
+                <v-layout wrap>
+                  <v-flex xs12 sm6>
+                    <v-layout>
+                      <v-flex xs6 sm5>
+                        <b>
+                          <h5 class="right my-1">
+                            <b>City:</b>
+                          </h5>
+                        </b>
+                      </v-flex>
+                      <v-flex sm7 xs6>
+                        <h5 class="my-1 left">{{ editedItem.city }}</h5>
+                      </v-flex>
+                    </v-layout>
+                  </v-flex>
+                  <v-flex xs12 sm6>
+                    <v-layout>
+                      <v-flex xs6 sm4>
+                        <b>
+                          <h5 class="right my-1">
+                            <b>State:</b>
+                          </h5>
+                        </b>
+                      </v-flex>
+                      <v-flex sm8 xs6>
+                        <h5 class="my-1">{{ editedItem.state }}</h5>
+                      </v-flex>
+                    </v-layout>
+                  </v-flex>
+                </v-layout>
+                <v-layout wrap>
+                  <v-flex xs12 sm6>
+                    <v-layout>
+                      <v-flex xs6 sm5>
+                        <b>
+                          <h5 class="right my-1">
+                            <b>Pincode:</b>
+                          </h5>
+                        </b>
+                      </v-flex>
+                      <v-flex sm7 xs6>
+                        <h5 class="my-1">{{ editedItem.pincode }}</h5>
+                      </v-flex>
+                    </v-layout>
+                  </v-flex>
+                  <v-flex xs12 sm5>
+                    <v-layout>
+                      <v-flex xs6 sm5>
+                        <b>
+                          <h5 class="right my-1">
+                            <b>Country:</b>
+                          </h5>
+                        </b>
+                      </v-flex>
+                      <v-flex sm7 xs6>
+                        <h5 class="my-1">{{ editedItem.country }}</h5>
+                      </v-flex>
+                    </v-layout>
+                  </v-flex>
+                </v-layout>
+                <v-layout wrap>
+                  <v-flex xs12 sm6>
+                    <v-layout>
+                      <v-flex sm5 xs6>
+                        <b>
+                          <h5 class="right my-1">
+                            <b>Mobile No:</b>
+                          </h5>
+                        </b>
+                      </v-flex>
+                      <v-flex sm6 xs6>
+                        <h5 class="my-1">{{ editedItem.mobile }}</h5>
+                      </v-flex>
+                    </v-layout>
+                  </v-flex>
+                  <v-flex xs12 sm6>
+                    <v-layout>
+                      <v-flex xs6 sm4>
+                        <b>
+                          <h5 class="right my-1">
+                            <b>Fahter Name:</b>
+                          </h5>
+                        </b>
+                      </v-flex>
+                      <v-flex sm8 xs6>
+                        <h5 class="my-1">{{ editedItem.fatherName }}</h5>
+                      </v-flex>
+                    </v-layout>
+                  </v-flex>
+                </v-layout>
+                <v-layout wrap>
+                  <v-flex xs12 sm5>
+                    <v-layout>
+                      <v-flex xs6 sm6>
+                        <b>
+                          <h5 class="right my-1">
+                            <b>Mother Name:</b>
+                          </h5>
+                        </b>
+                      </v-flex>
+                      <v-flex sm6 xs6>
+                        <h5 class="my-1">{{ editedItem.motherName }}</h5>
+                      </v-flex>
+                    </v-layout>
+                  </v-flex>
+                  <v-flex xs12 sm6>
+                    <v-layout>
+                      <v-flex xs6 sm6>
+                        <b>
+                          <h5 class="right my-1">
+                            <b>Father Cell No:</b>
+                          </h5>
+                        </b>
+                      </v-flex>
+                      <v-flex sm6 xs6>
+                        <h5 class="my-1">{{ editedItem.fatherCellNo }}</h5>
+                      </v-flex>
+                    </v-layout>
+                  </v-flex>
+                </v-layout>
+                <v-layout wrap>
+                  <v-flex xs12 sm5>
+                    <v-layout>
+                      <v-flex xs6 sm6>
+                        <b>
+                          <h5 class="right my-1">
+                            <b>Mother Cell No:</b>
+                          </h5>
+                        </b>
+                      </v-flex>
+                      <v-flex sm6 xs6>
+                        <h5 class="my-1">{{ editedItem.motherCellNo }}</h5>
+                      </v-flex>
+                    </v-layout>
+                  </v-flex>
+                  <v-flex xs12 sm6>
+                    <v-layout>
+                      <v-flex xs6 sm6>
+                        <b>
+                          <h5 class="my-1 right">
+                            <b>Academic Year:</b>
+                          </h5>
+                        </b>
+                      </v-flex>
+                      <v-flex sm5 xs6>
+                        <h5 class="my-1">{{ editedItem.establishmentYear }}</h5>
+                      </v-flex>
+                    </v-layout>
+                  </v-flex>
+                </v-layout>
+                <v-layout wrap>
+                  <v-flex xs12 sm5>
+                    <v-layout>
+                      <v-flex xs6 sm6>
+                        <b>
+                          <h5 class="my-1 right">
+                            <b>Medical Notes:</b>
+                          </h5>
+                        </b>
+                      </v-flex>
+                      <v-flex sm5 xs6>
+                        <h5 class="my-1">{{ editedItem.medicalNotes }}</h5>
+                      </v-flex>
+                    </v-layout>
+                  </v-flex>
+                  <v-flex xs12 sm6>
+                    <v-layout>
+                      <v-flex xs6 sm6>
+                        <b>
+                          <h5 class="right my-1">
+                            <b>Roll No. :</b>
+                          </h5>
+                        </b>
+                      </v-flex>
+                      <v-flex sm6 xs6>
+                        <h5 class="my-1">{{ editedItem.rollNo }}</h5>
                       </v-flex>
                     </v-layout>
+                  </v-flex>
+                </v-layout>
+                <v-layout wrap class="hidden-xs-only">
+                  <v-flex xs12 sm5>
                     <v-layout wrap>
-                      <v-flex xs12 sm5>
-                        <v-layout>
-                          <v-flex xs6 sm6>
-                            <b>
-                              <h5 class="right my-1">
-                                <b>Mother Name:</b>
-                              </h5>
-                            </b>
-                          </v-flex>
-                          <v-flex sm6 xs6>
-                            <h5 class="my-1">{{ editedItem.motherName }}</h5>
-                          </v-flex>
-                        </v-layout>
+                      <v-flex sm6>
+                        <b>
+                          <h5 class="my-1 right">
+                            <b>present Address:</b>
+                          </h5>
+                        </b>
                       </v-flex>
-                      <v-flex xs12 sm6>
-                        <v-layout>
-                          <v-flex xs6 sm6>
-                            <b>
-                              <h5 class="right my-1">
-                                <b>Father Cell No:</b>
-                              </h5>
-                            </b>
-                          </v-flex>
-                          <v-flex sm6 xs6>
-                            <h5 class="my-1">{{ editedItem.fatherCellNo }}</h5>
-                          </v-flex>
-                        </v-layout>
+                      <v-flex sm5>
+                        <h5 class="my-1">{{ editedItem.presentAddress }}</h5>
                       </v-flex>
                     </v-layout>
+                  </v-flex>
+                  <v-flex sm6>
                     <v-layout wrap>
-                      <v-flex xs12 sm5>
-                        <v-layout>
-                          <v-flex xs6 sm6>
-                            <b>
-                              <h5 class="right my-1">
-                                <b>Mother Cell No:</b>
-                              </h5>
-                            </b>
-                          </v-flex>
-                          <v-flex sm6 xs6>
-                            <h5 class="my-1">{{ editedItem.motherCellNo }}</h5>
-                          </v-flex>
-                        </v-layout>
+                      <v-flex sm6>
+                        <b>
+                          <h5 class="my-1 right">
+                            <b>Permanent Address:</b>
+                          </h5>
+                        </b>
                       </v-flex>
-                      <v-flex xs12 sm6>
-                        <v-layout>
-                          <v-flex xs6 sm6>
-                            <b>
-                              <h5 class="my-1 right">
-                                <b>Academic Year:</b>
-                              </h5>
-                            </b>
-                          </v-flex>
-                          <v-flex sm5 xs6>
-                            <h5 class="my-1">{{ editedItem.establishmentYear }}</h5>
-                          </v-flex>
-                        </v-layout>
+                      <v-flex sm6>
+                        <h5 class="my-1">{{ editedItem.permanentAddress }}</h5>
                       </v-flex>
                     </v-layout>
+                  </v-flex>
+                </v-layout>
+                <v-layout wrap class="hidden-sm-only hidden-md-only hidden-lg-only hidden-xl-only">
+                  <v-flex xs12 sm5>
                     <v-layout wrap>
-                      <v-flex xs12 sm5>
-                        <v-layout>
-                          <v-flex xs6 sm6>
-                            <b>
-                              <h5 class="my-1 right">
-                                <b>Medical Notes:</b>
-                              </h5>
-                            </b>
-                          </v-flex>
-                          <v-flex sm5 xs6>
-                            <h5 class="my-1">{{ editedItem.medicalNotes }}</h5>
-                          </v-flex>
-                        </v-layout>
+                      <v-flex xs8 sm6>
+                        <b>
+                          <h5 class="my-1">
+                            <b>present Address:-</b>
+                          </h5>
+                        </b>
                       </v-flex>
-                      <v-flex xs12 sm6>
-                        <v-layout>
-                          <v-flex xs6 sm6>
-                            <b>
-                              <h5 class="right my-1">
-                                <b>Roll No. :</b>
-                              </h5>
-                            </b>
-                          </v-flex>
-                          <v-flex sm6 xs8>
-                            <h5 class="my-1">{{ editedItem.rollNo }}</h5>
-                          </v-flex>
-                        </v-layout>
+                      <v-flex sm5 xs12>
+                        <h5 class="my-1">{{ editedItem.presentAddress }}</h5>
                       </v-flex>
                     </v-layout>
+                  </v-flex>
+                  <v-flex xs12 sm6>
                     <v-layout wrap>
-                      <v-flex xs12 sm5>
-                        <v-layout>
-                          <v-flex xs6 sm6>
-                            <b>
-                              <h5 class="my-1 right">
-                                <b>present Address:</b>
-                              </h5>
-                            </b>
-                          </v-flex>
-                          <v-flex sm5 xs6>
-                            <h5 class="my-1">{{ editedItem.presentAddress }}</h5>
-                          </v-flex>
-                        </v-layout>
+                      <v-flex xs9 sm6>
+                        <b>
+                          <h5 class="my-1">
+                            <b>Permanent Address:-</b>
+                          </h5>
+                        </b>
                       </v-flex>
-                      <v-flex xs12 sm6>
-                        <v-layout>
-                          <v-flex xs6 sm6>
-                            <b>
-                              <h5 class="right my-1">
-                                <b>present Address:</b>
-                              </h5>
-                            </b>
-                          </v-flex>
-                          <v-flex sm6 xs8>
-                            <h5 class="my-1">{{ editedItem.permanentAddress }}</h5>
-                          </v-flex>
-                        </v-layout>
+                      <v-flex sm6 xs12>
+                        <h5 class="my-1">{{ editedItem.permanentAddress }}</h5>
                       </v-flex>
-                      <!-- <v-flex xs12 sm12>
-                        <v-layout>
-                          <v-flex xs4 sm3>
-                            <b>
-                              <h5 class="right my-1">
-                                <b>Permanent Address:</b>
-                              </h5>
-                            </b>
-                          </v-flex>
-                          <v-flex sm9 xs8>
-                            <h5 class="my-1">{{ editedItem.permanentAddress }}</h5>
-                          </v-flex>
-                        </v-layout> 
-                      </v-flex>-->
                     </v-layout>
                   </v-flex>
                 </v-layout>
@@ -968,9 +939,11 @@
                 ></v-select>
               </v-flex>
             </v-layout>
-            <!-- <v-layout> -->
-            <v-btn @click="findStudents()" round block dark :loading="loading">Find</v-btn>
-            <!-- </v-layout> -->
+            <v-layout>
+              <v-flex xs5 class="mx-auto mb-2">
+                <v-btn @click="findStudents()" block round dark :loading="loading">Find</v-btn>
+              </v-flex>
+            </v-layout>
           </v-flex>
         </v-card>
         <v-data-table
@@ -1044,326 +1017,64 @@
                     <v-stepper-items>
                       <v-stepper-content step="1">
                         <v-container fluid class>
-                          <v-layout>
-                            <v-flex xs12>
-                              <v-snackbar
-                                :timeout="timeout"
-                                :top="y === 'top'"
-                                :right="x === 'right'"
-                                :vertical="mode === 'vertical'"
-                                v-model="snackbar"
-                                color="success"
-                              >{{ text }}</v-snackbar>
-                              <v-flex xs12 sm12>
-                                <v-form ref="parentForm" v-model="valid" lazy-validation>
-                                  <v-container fluid>
-                                    <v-layout>
-                                      <v-flex xs12 sm6>
-                                        <v-layout>
-                                          <v-flex xs4 class="pt-4 subheading">
-                                            <label class="right">Parent Email Id:</label>
-                                          </v-flex>
-                                          <v-flex xs8 class="ml-3">
-                                            <v-text-field
-                                              placeholder="fill Parent email"
-                                              :rules="emailRules"
-                                              v-model.trim="parentData.email"
-                                              type="text"
-                                              v-on:keyup="getParentDetails"
-                                              name="email"
-                                              required
-                                            ></v-text-field>
-                                          </v-flex>
-                                        </v-layout>
-                                      </v-flex>
-                                      <v-flex xs12 sm6>
-                                        <v-layout>
-                                          <v-flex xs4 class="pt-4 subheading">
-                                            <label class="right">Father Name:</label>
-                                          </v-flex>
-                                          <v-flex xs8 class="ml-3">
-                                            <v-text-field
-                                              v-model="parentData.fatherName"
-                                              :rules="fatherNameRules"
-                                              placeholder="Fill your father Name"
-                                              required
-                                            ></v-text-field>
-                                          </v-flex>
-                                        </v-layout>
-                                      </v-flex>
-                                    </v-layout>
-                                    <v-layout>
-                                      <v-flex xs12 sm6>
-                                        <v-layout>
-                                          <v-flex xs4 class="pt-4 subheading">
-                                            <label class="right">Father Cell No:</label>
-                                          </v-flex>
-                                          <v-flex xs8 class="ml-3">
-                                            <v-text-field
-                                              v-model="parentData.fatherCellNo"
-                                              placeholder="fill your father Cell Number"
-                                              name="state"
-                                              type="number"
-                                              :rules="fatheCellNoRules"
-                                              required
-                                            ></v-text-field>
-                                          </v-flex>
-                                        </v-layout>
-                                      </v-flex>
-                                      <v-flex xs12 sm6>
-                                        <v-layout>
-                                          <v-flex xs4 class="pt-4 subheading">
-                                            <label class="right">Mother Name:</label>
-                                          </v-flex>
-                                          <v-flex xs8 class="ml-3">
-                                            <v-text-field
-                                              v-model="parentData.motherName"
-                                              placeholder="fill your Mother Name"
-                                              name="state"
-                                              type="text"
-                                              :rules="motherNameRules"
-                                              required
-                                            ></v-text-field>
-                                          </v-flex>
-                                        </v-layout>
-                                      </v-flex>
-                                    </v-layout>
-                                    <v-layout>
-                                      <v-flex xs12 sm6>
-                                        <v-layout>
-                                          <v-flex xs4 class="pt-4 subheading">
-                                            <label class="right">Mother Cell No:</label>
-                                          </v-flex>
-                                          <v-flex xs8 class="ml-3">
-                                            <v-text-field
-                                              v-model="parentData.motherCellNo"
-                                              placeholder="fill your  Mother Cell Number"
-                                              name="state"
-                                              type="number"
-                                              :rules="motherCellNoRules"
-                                              required
-                                            ></v-text-field>
-                                          </v-flex>
-                                        </v-layout>
-                                      </v-flex>
-                                    </v-layout>
-                                    <v-flex xs12 sm12>
-                                      <v-card-actions>
-                                        <v-spacer></v-spacer>
-                                        <v-btn
-                                          @click="submitParentDetails"
-                                          round
-                                          dark
-                                          :loading="loading"
-                                          v-show="showParent"
-                                        >Add</v-btn>
-                                        <v-btn v-show="showNext" @click="e2 = 2" round dark>Next</v-btn>
-                                      </v-card-actions>
-                                    </v-flex>
-                                  </v-container>
-                                </v-form>
-                              </v-flex>
-                            </v-flex>
-                          </v-layout>
-                        </v-container>
-                      </v-stepper-content>
-                      <v-stepper-content step="2">
-                        <!-- <v-container fluid> -->
-                        <v-snackbar
-                          :timeout="timeout"
-                          :top="y === 'top'"
-                          :right="x === 'right'"
-                          :vertical="mode === 'vertical'"
-                          v-model="snackbar"
-                          color="success"
-                        >{{ text }}</v-snackbar>
-                        <v-flex xs12 sm12>
-                          <v-form ref="form" v-model="valid" lazy-validation>
-                            <v-container fluid>
-                              <v-layout>
-                                <v-flex
-                                  xs12
-                                  class="text-xs-center text-sm-center text-md-center text-lg-center mr-4"
-                                >
-                                  <v-avatar size="100px">
-                                    <img src="/static/icon/user.png" v-if="!imageUrl" />
-                                  </v-avatar>
-                                  <input
-                                    type="file"
-                                    style="display: none"
-                                    ref="image"
-                                    accept="image/*"
-                                    @change="onFilePicked"
-                                  />
-                                  <img
-                                    :src="imageData.imageUrl"
-                                    height="150"
-                                    v-if="imageUrl"
-                                    style="border-radius:50%; width:200px"
-                                  />
-                                </v-flex>
-                              </v-layout>
-                              <v-layout>
-                                <v-flex xs12 sm6>
-                                  <v-layout>
-                                    <v-flex x4 sm4 class="pt-4 subheading">
-                                      <label
-                                        class="right hidden-xs-only hidden-sm-only"
-                                      >Select Class:</label>
-                                      <label
-                                        class="right hidden-lg-only hidden-md-only hidden-xl-only"
-                                      >Class:</label>
-                                    </v-flex>
-                                    <v-flex xs8 sm8 class="ml-3">
-                                      <v-select
-                                        :items="addclass"
-                                        label="Select Class"
-                                        v-model="addStudents.select"
-                                        item-text="classNum"
-                                        item-value="_id"
-                                        name="Select Class"
-                                        :rules="classRules"
-                                        @change="getSection(addStudents.select)"
-                                        required
-                                      ></v-select>
-                                    </v-flex>
-                                  </v-layout>
-                                </v-flex>
+                          <v-snackbar
+                            :timeout="timeout"
+                            :top="y === 'top'"
+                            :right="x === 'right'"
+                            :vertical="mode === 'vertical'"
+                            v-model="snackbar"
+                            color="success"
+                          >{{ text }}</v-snackbar>
+                          <v-flex xs12 sm12>
+                            <v-form ref="parentForm" v-model="valid" lazy-validation>
+                              <v-layout wrap>
                                 <v-flex xs12 sm6>
                                   <v-layout>
                                     <v-flex xs4 class="pt-4 subheading">
-                                      <label
-                                        class="right hidden-xs-only hidden-sm-only"
-                                      >Select Section:</label>
-                                      <label
-                                        class="right hidden-lg-only hidden-md-only hidden-xl-only"
-                                      >Section:</label>
+                                      <label class="right">Parent Email Id:</label>
                                     </v-flex>
                                     <v-flex xs8 class="ml-3">
-                                      <v-select
-                                        :items="addSection"
-                                        label="Select Section"
-                                        v-model="addStudents.selectSection"
-                                        item-text="name"
-                                        item-value="_id"
-                                        name="Select Section"
-                                        :rules="sectionRules"
-                                        required
-                                      ></v-select>
-                                    </v-flex>
-                                  </v-layout>
-                                </v-flex>
-                              </v-layout>
-                              <v-layout>
-                                <v-flex xs12 sm6>
-                                  <v-layout>
-                                    <v-flex xs4 sm4 class="pt-4 subheading">
-                                      <label class="right hidden-xs-only hidden-sm-only">Full Name:</label>
-                                      <label
-                                        class="right hidden-lg-only hidden-md-only hidden-xl-only"
-                                      >Name:</label>
-                                    </v-flex>
-                                    <v-flex xs8 sm8 class="ml-3">
-                                      <v-text-field
-                                        v-model="addStudents.name"
-                                        placeholder="fill your full Name"
-                                        name="name"
-                                        type="text"
-                                        :rules="nameRules"
-                                        required
-                                      ></v-text-field>
-                                    </v-flex>
-                                  </v-layout>
-                                </v-flex>
-                                <v-flex xs12 sm6>
-                                  <v-layout>
-                                    <v-flex xs4 sm4 class="pt-4 subheading">
-                                      <label class="right">Email ID:</label>
-                                    </v-flex>
-                                    <v-flex xs8 sm8 class="ml-3">
                                       <v-text-field
-                                        placeholder="fill your email"
+                                        placeholder="fill Parent email"
                                         :rules="emailRules"
-                                        v-model="addStudents.email"
+                                        v-model.trim="parentData.email"
                                         type="text"
+                                        v-on:keyup="getParentDetails"
                                         name="email"
                                         required
                                       ></v-text-field>
                                     </v-flex>
                                   </v-layout>
                                 </v-flex>
-                              </v-layout>
-                              <v-layout>
-                                <v-flex xs12 sm6>
-                                  <v-layout>
-                                    <v-flex xs4 sm4 class="pt-4 subheading">
-                                      <label
-                                        class="right hidden-sm-only hidden-xs-only"
-                                      >Date of Birth:</label>
-                                      <label
-                                        class="right hidden-lg-only hidden-xl-only hidden-md-only"
-                                      >D.O.B:</label>
-                                    </v-flex>
-                                    <v-flex xs8 sm8 class="ml-3">
-                                      <v-menu
-                                        ref="menu"
-                                        :close-on-content-click="false"
-                                        v-model="menu"
-                                        :nudge-right="40"
-                                        lazy
-                                        transition="scale-transition"
-                                        offset-y
-                                        full-width
-                                        min-width="290px"
-                                      >
-                                        <v-text-field
-                                          slot="activator"
-                                          :rules="dateRules"
-                                          v-model="addStudents.date"
-                                          placeholder="Select date"
-                                        ></v-text-field>
-                                        <v-date-picker
-                                          ref="picker"
-                                          v-model="addStudents.date"
-                                          :max="new Date().toISOString().substr(0, 10)"
-                                          min="1950-01-01"
-                                          @input="menu = false"
-                                        ></v-date-picker>
-                                      </v-menu>
-                                    </v-flex>
-                                  </v-layout>
-                                </v-flex>
                                 <v-flex xs12 sm6>
                                   <v-layout>
                                     <v-flex xs4 class="pt-4 subheading">
-                                      <label class="right">City:</label>
+                                      <label class="right">Father Name:</label>
                                     </v-flex>
                                     <v-flex xs8 class="ml-3">
                                       <v-text-field
-                                        v-model="addStudents.city"
-                                        placeholder="fill your City Name"
-                                        name="City"
-                                        type="text"
-                                        :rules="cityRules"
+                                        v-model="parentData.fatherName"
+                                        :rules="fatherNameRules"
+                                        placeholder="Fill your father Name"
                                         required
                                       ></v-text-field>
                                     </v-flex>
                                   </v-layout>
                                 </v-flex>
                               </v-layout>
-                              <v-layout>
+                              <v-layout wrap>
                                 <v-flex xs12 sm6>
                                   <v-layout>
                                     <v-flex xs4 class="pt-4 subheading">
-                                      <label class="right">State:</label>
+                                      <label class="right">Father Cell No:</label>
                                     </v-flex>
                                     <v-flex xs8 class="ml-3">
                                       <v-text-field
-                                        v-model="addStudents.state"
-                                        placeholder="fill your State Name"
+                                        v-model="parentData.fatherCellNo"
+                                        placeholder="fill your father Cell Number"
                                         name="state"
-                                        type="text"
-                                        :rules="stateRules"
+                                        type="number"
+                                        :rules="fatheCellNoRules"
                                         required
                                       ></v-text-field>
                                     </v-flex>
@@ -1372,322 +1083,598 @@
                                 <v-flex xs12 sm6>
                                   <v-layout>
                                     <v-flex xs4 class="pt-4 subheading">
-                                      <label class="right">Pincode:</label>
+                                      <label class="right">Mother Name:</label>
                                     </v-flex>
                                     <v-flex xs8 class="ml-3">
                                       <v-text-field
-                                        v-model="addStudents.pincode"
-                                        placeholder="fill your pincode"
-                                        name="pincode"
-                                        type="number"
-                                        :rules="pincode"
+                                        v-model="parentData.motherName"
+                                        placeholder="fill your Mother Name"
+                                        name="state"
+                                        type="text"
+                                        :rules="motherNameRules"
                                         required
                                       ></v-text-field>
                                     </v-flex>
                                   </v-layout>
                                 </v-flex>
                               </v-layout>
-                              <v-layout>
+                              <v-layout wrap>
                                 <v-flex xs12 sm6>
                                   <v-layout>
                                     <v-flex xs4 class="pt-4 subheading">
-                                      <label class="right hidden-xs-only hidden-sm-only">Mobile No:</label>
-                                      <label
-                                        class="right hidden-lg-only hidden-md-only hidden-xl-only"
-                                      >Mobile:</label>
+                                      <label class="right">Mother Cell No:</label>
                                     </v-flex>
                                     <v-flex xs8 class="ml-3">
                                       <v-text-field
-                                        v-model="addStudents.mobile"
-                                        placeholder="fill your MobileNo"
-                                        name="mobileNo"
+                                        v-model="parentData.motherCellNo"
+                                        placeholder="fill your  Mother Cell Number"
+                                        name="state"
                                         type="number"
-                                        :rules="mobileNoRules"
+                                        :rules="motherCellNoRules"
                                         required
                                       ></v-text-field>
                                     </v-flex>
                                   </v-layout>
                                 </v-flex>
-                                <v-flex xs12 sm6>
-                                  <v-layout>
-                                    <v-flex xs4 class="pt-4 subheading">
-                                      <label
-                                        class="right hidden-xs-only hidden-sm-only"
-                                      >Select Country:</label>
-                                      <label
-                                        class="right hidden-lg-only hidden-md-only hidden-xl-only"
-                                      >Country:</label>
-                                    </v-flex>
-                                    <v-flex xs8 class="ml-3">
-                                      <v-autocomplete
-                                        v-model="addStudents.country"
-                                        :rules="country"
-                                        :items="countries"
-                                        placeholder="Select Country Name"
-                                        required
-                                      ></v-autocomplete>
-                                    </v-flex>
-                                  </v-layout>
-                                </v-flex>
                               </v-layout>
-                              <v-layout>
-                                <v-flex xs12 sm6>
-                                  <v-layout>
-                                    <v-flex xs4 class="pt-4 subheading">
-                                      <label class="right">Gender:</label>
-                                    </v-flex>
-                                    <v-flex xs8 class="ml-3">
-                                      <v-select
-                                        :items="gender"
-                                        v-model="addStudents.gender"
-                                        :rules="genderRules"
-                                        label="Select Gender"
-                                        required
-                                      ></v-select>
-                                    </v-flex>
-                                  </v-layout>
-                                </v-flex>
-                                <v-flex xs12 sm6>
-                                  <v-layout>
-                                    <v-flex xs4 class="pt-4 subheading">
-                                      <label
-                                        class="right hidden-xs-only hidden-sm-only"
-                                      >Blood Group:</label>
-                                      <label
-                                        class="right hidden-lg-only hidden-md-only hidden-xl-only"
-                                      >Blood:</label>
-                                    </v-flex>
-                                    <v-flex xs8 class="ml-3">
-                                      <v-text-field
-                                        v-model="addStudents.bloodGroup"
-                                        placeholder="Fill your Blood Group"
-                                        required
-                                      ></v-text-field>
-                                    </v-flex>
-                                  </v-layout>
-                                </v-flex>
-                              </v-layout>
-                              <v-layout>
-                                <v-flex xs12 sm6>
-                                  <v-layout>
-                                    <v-flex xs4 class="pt-4 subheading">
-                                      <label class="right">Allergies:</label>
-                                    </v-flex>
-                                    <v-flex xs8 class="ml-3">
-                                      <v-text-field
-                                        v-model="addStudents.allergies"
-                                        placeholder="Fill your Allergies"
-                                        required
-                                      ></v-text-field>
-                                    </v-flex>
-                                  </v-layout>
-                                </v-flex>
-                                <v-flex xs12 sm6>
-                                  <v-layout>
-                                    <v-flex xs4 class="pt-4 subheading">
-                                      <label class="right">Medical Notes:</label>
-                                    </v-flex>
-                                    <v-flex xs8 class="ml-3">
-                                      <v-text-field
-                                        v-model="addStudents.medicalNotes"
-                                        placeholder="Fill your Medical Notes"
-                                        required
-                                      ></v-text-field>
-                                    </v-flex>
-                                  </v-layout>
-                                </v-flex>
-                              </v-layout>
-                              <v-layout>
-                                <v-flex xs12 sm6>
-                                  <v-layout>
-                                    <v-flex xs4 class="pt-4 subheading">
-                                      <label class="right">Height:</label>
-                                    </v-flex>
-                                    <v-flex xs8 class="ml-3">
-                                      <v-text-field
-                                        v-model="addStudents.height"
-                                        placeholder="Fill your Height"
-                                        required
-                                      ></v-text-field>
-                                    </v-flex>
-                                  </v-layout>
-                                </v-flex>
-                                <v-flex xs12 sm6>
-                                  <v-layout>
-                                    <v-flex xs4 class="pt-4 subheading">
-                                      <label class="right">Weight:</label>
-                                    </v-flex>
-                                    <v-flex xs8 class="ml-3">
-                                      <v-text-field
-                                        v-model="addStudents.weight"
-                                        placeholder="Fill your Weight"
-                                        required
-                                      ></v-text-field>
-                                    </v-flex>
-                                  </v-layout>
-                                </v-flex>
-                              </v-layout>
-                              <v-layout>
-                                <v-flex xs12 sm6>
-                                  <v-layout>
-                                    <v-flex xs4 class="pt-4 subheading">
-                                      <label
-                                        class="right hidden-xs-only hidden-sm-only"
-                                      >Uplaod Image:</label>
-                                      <label
-                                        class="right hidden-lg-only hidden-md-only hidden-xl-only"
-                                      >Uplaod :</label>
-                                    </v-flex>
-                                    <v-flex xs8 class="ml-3">
-                                      <v-text-field
-                                        label="Select Image"
-                                        @click="pickFile"
-                                        v-model="imageName"
-                                        append-icon="attach_file"
-                                      ></v-text-field>
-                                    </v-flex>
-                                  </v-layout>
-                                </v-flex>
-                                <v-flex xs12 sm6>
-                                  <v-layout>
-                                    <v-flex xs4 class="pt-4 subheading">
-                                      <label class="right">Academic Year:</label>
-                                    </v-flex>
-                                    <v-flex xs8 class="ml-3">
-                                      <v-text-field
-                                        v-model="addStudents.establishmentYear"
-                                        placeholder="fill your Academic Year"
-                                        name="state"
-                                        type="number"
-                                        :rules="establishmentYearRules"
-                                        required
-                                      ></v-text-field>
-                                    </v-flex>
-                                  </v-layout>
-                                </v-flex>
-                              </v-layout>
-                              <v-layout>
-                                <v-flex xs12 sm6>
-                                  <v-layout>
-                                    <v-flex xs4 class="pt-4 subheading">
-                                      <label
-                                        class="right hidden-xs-only hidden-sm-only"
-                                      >Roll Number:</label>
-                                      <label
-                                        class="right hidden-lg-only hidden-md-only hidden-xl-only"
-                                      >Roll No:</label>
-                                    </v-flex>
-                                    <v-flex xs8 class="ml-3">
-                                      <v-text-field
-                                        v-model="addStudents.rollNo"
-                                        placeholder="Fill your Roll Number"
-                                        required
-                                      ></v-text-field>
-                                    </v-flex>
-                                  </v-layout>
-                                </v-flex>
-                              </v-layout>
-                              <v-layout class="hidden-xs-only hidden-sm-only">
-                                <v-flex xs12 sm12>
-                                  <v-layout>
-                                    <v-flex xs4 sm2 class="pt-4 subheading ml-5">
-                                      <label class="right pr-4">Present Address:</label>
-                                    </v-flex>
-                                    <v-flex xs8 sm12>
-                                      <v-text-field
-                                        name="input-4-3"
-                                        v-model="addStudents.presentAddress"
-                                        :rules="presentAddress"
-                                        placeholder="fill Your present Address"
-                                        required
-                                      ></v-text-field>
-                                    </v-flex>
-                                  </v-layout>
-                                </v-flex>
-                                <v-flex xs12 sm12>
-                                  <v-layout>
-                                    <v-flex xs4 sm2 class="pt-4 subheading ml-5 addressForm">
-                                      <label class>Permanent Address:</label>
-                                    </v-flex>
-                                    <v-flex xs12 sm12>
-                                      <v-text-field
-                                        name="input-4-3"
-                                        v-model="addStudents.permanentAddress"
-                                        :rules="permanentAddress"
-                                        placeholder="fill Your Permanent Address"
-                                        required
-                                      ></v-text-field>
-                                    </v-flex>
-                                  </v-layout>
-                                </v-flex>
-                              </v-layout>
-                              <v-layout class="hidden-lg-only hidden-md-only hidden-xl-only">
-                                <v-flex xs12 sm12>
-                                  <v-layout>
-                                    <v-flex xs12 sm3 class="pt-4 subheading text-xs-center">
-                                      <label class>Present Address :</label>
-                                    </v-flex>
-                                  </v-layout>
-                                  <v-layout>
-                                    <v-flex xs12 sm12>
-                                      <v-textarea
-                                        name="input-4-3"
-                                        v-model="addStudents.presentAddress"
-                                        :rules="presentAddress"
-                                        placeholder="fill Your present Address"
-                                        required
-                                      ></v-textarea>
-                                    </v-flex>
-                                  </v-layout>
-                                </v-flex>
-                                <v-flex xs12 sm12>
-                                  <v-layout>
-                                    <v-flex
-                                      xs12
-                                      sm3
-                                      class="pt-4 pr-4 subheading text-xs-center addressForm"
-                                    >
-                                      <label>Permanent addr:</label>
-                                    </v-flex>
-                                  </v-layout>
-                                  <v-layout>
-                                    <v-flex xs12 sm12>
-                                      <v-textarea
-                                        name="input-4-3"
-                                        v-model="addStudents.permanentAddress"
-                                        :rules="permanentAddress"
-                                        placeholder="fill Your Permanent Address"
-                                        required
-                                      ></v-textarea>
-                                    </v-flex>
-                                  </v-layout>
-                                </v-flex>
-                              </v-layout>
-                              <v-layout>
-                                <v-flex xs12 sm12>
-                                  <!-- <v-card-actions> -->
-                                  <!-- <v-btn @click="clear" round dark>clear</v-btn> -->
-                                  <v-layout>
-                                    <v-flex xs6>
-                                      <v-btn round dark @click="e2 = 1">Back</v-btn>
-                                    </v-flex>
-                                    <!-- <v-spacer></v-spacer> -->
-                                    <v-flex xs6>
-                                      <v-btn
-                                        @click="submit"
-                                        round
-                                        dark
-                                        :loading="loading"
-                                        class="right"
-                                      >Add</v-btn>
-                                    </v-flex>
-                                  </v-layout>
-                                  <!-- </v-card-actions> -->
-                                </v-flex>
-                              </v-layout>
-                            </v-container>
-                          </v-form>
-                        </v-flex>
+                              <v-flex sm12 class="hidden-xs-only">
+                                <v-card-actions>
+                                  <v-spacer></v-spacer>
+                                  <v-btn
+                                    @click="submitParentDetails"
+                                    round
+                                    dark
+                                    :loading="loading"
+                                    v-show="showParent"
+                                  >Add</v-btn>
+                                  <v-btn v-show="showNext" @click="e2 = 2" round dark>Next</v-btn>
+                                </v-card-actions>
+                              </v-flex>
+                                <v-flex xs6 class="hidden-md-only hidden-sm-only hidden-lg-only hidden-xl-only mx-auto mt-2">
+                                  <v-btn
+                                    @click="submitParentDetails"
+                                    round
+                                    dark
+                                    :loading="loading"
+                                    v-show="showParent"
+                                  >Add</v-btn>
+                                  <v-btn v-show="showNext" @click="e2 = 2" round dark>Next</v-btn>
+                              </v-flex>
+                            </v-form>
+                          </v-flex>
+                        </v-container>
+                      </v-stepper-content>
+                      <v-stepper-content step="2">
+                        <!-- <v-container fluid> -->
+                          <v-snackbar
+                            :timeout="timeout"
+                            :top="y === 'top'"
+                            :right="x === 'right'"
+                            :vertical="mode === 'vertical'"
+                            v-model="snackbar"
+                            color="success"
+                          >{{ text }}</v-snackbar>
+                          <v-flex xs12 sm12>
+                            <v-form ref="form" v-model="valid" lazy-validation>
+                              <!-- <v-container fluid> -->
+                                <v-layout>
+                                  <v-flex
+                                    xs12
+                                    class="text-xs-center text-sm-center text-md-center text-lg-center"
+                                  >
+                                    <v-avatar size="100px">
+                                      <img src="/static/icon/user.png" v-if="!imageUrl" />
+                                    </v-avatar>
+                                    <input
+                                      type="file"
+                                      style="display: none"
+                                      ref="image"
+                                      accept="image/*"
+                                      @change="onFilePicked"
+                                    />
+                                    <img
+                                      :src="imageData.imageUrl"
+                                      height="150"
+                                      v-if="imageUrl"
+                                      style="border-radius:50%; width:200px"
+                                    />
+                                  </v-flex>
+                                </v-layout>
+                                <v-layout wrap>
+                                  <v-flex xs12 sm6>
+                                    <v-layout>
+                                      <v-flex x4 sm4 class="pt-4 subheading">
+                                        <label
+                                          class="right hidden-xs-only hidden-sm-only"
+                                        >Select Class:</label>
+                                        <label
+                                          class="right hidden-lg-only hidden-md-only hidden-xl-only"
+                                        >Class:</label>
+                                      </v-flex>
+                                      <v-flex xs8 sm8 class="ml-3">
+                                        <v-select
+                                          :items="addclass"
+                                          label="Select Class"
+                                          v-model="addStudents.select"
+                                          item-text="classNum"
+                                          item-value="_id"
+                                          name="Select Class"
+                                          :rules="classRules"
+                                          @change="getSection(addStudents.select)"
+                                          required
+                                        ></v-select>
+                                      </v-flex>
+                                    </v-layout>
+                                  </v-flex>
+                                  <v-flex xs12 sm6>
+                                    <v-layout>
+                                      <v-flex xs4 class="pt-4 subheading">
+                                        <label
+                                          class="right hidden-xs-only hidden-sm-only"
+                                        >Select Section:</label>
+                                        <label
+                                          class="right hidden-lg-only hidden-md-only hidden-xl-only"
+                                        >Section:</label>
+                                      </v-flex>
+                                      <v-flex xs8 class="ml-3">
+                                        <v-select
+                                          :items="addSection"
+                                          label="Select Section"
+                                          v-model="addStudents.selectSection"
+                                          item-text="name"
+                                          item-value="_id"
+                                          name="Select Section"
+                                          :rules="sectionRules"
+                                          required
+                                        ></v-select>
+                                      </v-flex>
+                                    </v-layout>
+                                  </v-flex>
+                                </v-layout>
+                                <v-layout wrap>
+                                  <v-flex xs12 sm6>
+                                    <v-layout>
+                                      <v-flex xs4 sm4 class="pt-4 subheading">
+                                        <label
+                                          class="right hidden-xs-only hidden-sm-only"
+                                        >Full Name:</label>
+                                        <label
+                                          class="right hidden-lg-only hidden-md-only hidden-xl-only"
+                                        >Name:</label>
+                                      </v-flex>
+                                      <v-flex xs8 sm8 class="ml-3">
+                                        <v-text-field
+                                          v-model="addStudents.name"
+                                          placeholder="fill your full Name"
+                                          name="name"
+                                          type="text"
+                                          :rules="nameRules"
+                                          required
+                                        ></v-text-field>
+                                      </v-flex>
+                                    </v-layout>
+                                  </v-flex>
+                                  <v-flex xs12 sm6>
+                                    <v-layout>
+                                      <v-flex xs4 sm4 class="pt-4 subheading">
+                                        <label class="right">Email ID:</label>
+                                      </v-flex>
+                                      <v-flex xs8 sm8 class="ml-3">
+                                        <v-text-field
+                                          placeholder="fill your email"
+                                          :rules="emailRules"
+                                          v-model="addStudents.email"
+                                          type="text"
+                                          name="email"
+                                          required
+                                        ></v-text-field>
+                                      </v-flex>
+                                    </v-layout>
+                                  </v-flex>
+                                </v-layout>
+                                <v-layout wrap>
+                                  <v-flex xs12 sm6>
+                                    <v-layout>
+                                      <v-flex xs4 sm4 class="pt-4 subheading">
+                                        <label
+                                          class="right hidden-sm-only hidden-xs-only"
+                                        >Date of Birth:</label>
+                                        <label
+                                          class="right hidden-lg-only hidden-xl-only hidden-md-only"
+                                        >D.O.B:</label>
+                                      </v-flex>
+                                      <v-flex xs8 sm8 class="ml-3">
+                                        <v-menu
+                                          ref="menu"
+                                          :close-on-content-click="false"
+                                          v-model="menu"
+                                          :nudge-right="40"
+                                          lazy
+                                          transition="scale-transition"
+                                          offset-y
+                                          full-width
+                                          min-width="290px"
+                                        >
+                                          <v-text-field
+                                            slot="activator"
+                                            :rules="dateRules"
+                                            v-model="addStudents.date"
+                                            placeholder="Select date"
+                                          ></v-text-field>
+                                          <v-date-picker
+                                            ref="picker"
+                                            v-model="addStudents.date"
+                                            :max="new Date().toISOString().substr(0, 10)"
+                                            min="1950-01-01"
+                                            @input="menu = false"
+                                          ></v-date-picker>
+                                        </v-menu>
+                                      </v-flex>
+                                    </v-layout>
+                                  </v-flex>
+                                  <v-flex xs12 sm6>
+                                    <v-layout>
+                                      <v-flex xs4 class="pt-4 subheading">
+                                        <label class="right">City:</label>
+                                      </v-flex>
+                                      <v-flex xs8 class="ml-3">
+                                        <v-text-field
+                                          v-model="addStudents.city"
+                                          placeholder="fill your City Name"
+                                          name="City"
+                                          type="text"
+                                          :rules="cityRules"
+                                          required
+                                        ></v-text-field>
+                                      </v-flex>
+                                    </v-layout>
+                                  </v-flex>
+                                </v-layout>
+                                <v-layout wrap>
+                                  <v-flex xs12 sm6>
+                                    <v-layout>
+                                      <v-flex xs4 class="pt-4 subheading">
+                                        <label class="right">State:</label>
+                                      </v-flex>
+                                      <v-flex xs8 class="ml-3">
+                                        <v-text-field
+                                          v-model="addStudents.state"
+                                          placeholder="fill your State Name"
+                                          name="state"
+                                          type="text"
+                                          :rules="stateRules"
+                                          required
+                                        ></v-text-field>
+                                      </v-flex>
+                                    </v-layout>
+                                  </v-flex>
+                                  <v-flex xs12 sm6>
+                                    <v-layout>
+                                      <v-flex xs4 class="pt-4 subheading">
+                                        <label class="right">Pincode:</label>
+                                      </v-flex>
+                                      <v-flex xs8 class="ml-3">
+                                        <v-text-field
+                                          v-model="addStudents.pincode"
+                                          placeholder="fill your pincode"
+                                          name="pincode"
+                                          type="number"
+                                          :rules="pincode"
+                                          required
+                                        ></v-text-field>
+                                      </v-flex>
+                                    </v-layout>
+                                  </v-flex>
+                                </v-layout>
+                                <v-layout wrap>
+                                  <v-flex xs12 sm6>
+                                    <v-layout>
+                                      <v-flex xs4 class="pt-4 subheading">
+                                        <label
+                                          class="right hidden-xs-only hidden-sm-only"
+                                        >Mobile No:</label>
+                                        <label
+                                          class="right hidden-lg-only hidden-md-only hidden-xl-only"
+                                        >Mobile:</label>
+                                      </v-flex>
+                                      <v-flex xs8 class="ml-3">
+                                        <v-text-field
+                                          v-model="addStudents.mobile"
+                                          placeholder="fill your MobileNo"
+                                          name="mobileNo"
+                                          type="number"
+                                          :rules="mobileNoRules"
+                                          required
+                                        ></v-text-field>
+                                      </v-flex>
+                                    </v-layout>
+                                  </v-flex>
+                                  <v-flex xs12 sm6>
+                                    <v-layout>
+                                      <v-flex xs4 class="pt-4 subheading">
+                                        <label
+                                          class="right hidden-xs-only hidden-sm-only"
+                                        >Select Country:</label>
+                                        <label
+                                          class="right hidden-lg-only hidden-md-only hidden-xl-only"
+                                        >Country:</label>
+                                      </v-flex>
+                                      <v-flex xs8 class="ml-3">
+                                        <v-autocomplete
+                                          v-model="addStudents.country"
+                                          :rules="country"
+                                          :items="countries"
+                                          placeholder="Select Country Name"
+                                          required
+                                        ></v-autocomplete>
+                                      </v-flex>
+                                    </v-layout>
+                                  </v-flex>
+                                </v-layout>
+                                <v-layout wrap>
+                                  <v-flex xs12 sm6>
+                                    <v-layout>
+                                      <v-flex xs4 class="pt-4 subheading">
+                                        <label class="right">Gender:</label>
+                                      </v-flex>
+                                      <v-flex xs8 class="ml-3">
+                                        <v-select
+                                          :items="gender"
+                                          v-model="addStudents.gender"
+                                          :rules="genderRules"
+                                          label="Select Gender"
+                                          required
+                                        ></v-select>
+                                      </v-flex>
+                                    </v-layout>
+                                  </v-flex>
+                                  <v-flex xs12 sm6>
+                                    <v-layout>
+                                      <v-flex xs4 class="pt-4 subheading">
+                                        <label
+                                          class="right hidden-xs-only hidden-sm-only"
+                                        >Blood Group:</label>
+                                        <label
+                                          class="right hidden-lg-only hidden-md-only hidden-xl-only"
+                                        >Blood:</label>
+                                      </v-flex>
+                                      <v-flex xs8 class="ml-3">
+                                        <v-text-field
+                                          v-model="addStudents.bloodGroup"
+                                          placeholder="Fill your Blood Group"
+                                          required
+                                        ></v-text-field>
+                                      </v-flex>
+                                    </v-layout>
+                                  </v-flex>
+                                </v-layout>
+                                <v-layout wrap>
+                                  <v-flex xs12 sm6>
+                                    <v-layout>
+                                      <v-flex xs4 class="pt-4 subheading">
+                                        <label class="right">Allergies:</label>
+                                      </v-flex>
+                                      <v-flex xs8 class="ml-3">
+                                        <v-text-field
+                                          v-model="addStudents.allergies"
+                                          placeholder="Fill your Allergies"
+                                          required
+                                        ></v-text-field>
+                                      </v-flex>
+                                    </v-layout>
+                                  </v-flex>
+                                  <v-flex xs12 sm6>
+                                    <v-layout>
+                                      <v-flex xs4 class="pt-4 subheading">
+                                        <label
+                                          class="right hidden-xs-only hidden-sm-only"
+                                        >Medical Notes:</label>
+                                        <label
+                                          class="right hidden-lg-only hidden-md-only hidden-xl-only"
+                                        >Medical:</label>
+                                      </v-flex>
+                                      <v-flex xs8 class="ml-3">
+                                        <v-text-field
+                                          v-model="addStudents.medicalNotes"
+                                          placeholder="Fill your Medical Notes"
+                                          required
+                                        ></v-text-field>
+                                      </v-flex>
+                                    </v-layout>
+                                  </v-flex>
+                                </v-layout>
+                                <v-layout wrap>
+                                  <v-flex xs12 sm6>
+                                    <v-layout>
+                                      <v-flex xs4 class="pt-4 subheading">
+                                        <label class="right">Height:</label>
+                                      </v-flex>
+                                      <v-flex xs8 class="ml-3">
+                                        <v-text-field
+                                          v-model="addStudents.height"
+                                          placeholder="Fill your Height"
+                                          required
+                                        ></v-text-field>
+                                      </v-flex>
+                                    </v-layout>
+                                  </v-flex>
+                                  <v-flex xs12 sm6>
+                                    <v-layout>
+                                      <v-flex xs4 class="pt-4 subheading">
+                                        <label class="right">Weight:</label>
+                                      </v-flex>
+                                      <v-flex xs8 class="ml-3">
+                                        <v-text-field
+                                          v-model="addStudents.weight"
+                                          placeholder="Fill your Weight"
+                                          required
+                                        ></v-text-field>
+                                      </v-flex>
+                                    </v-layout>
+                                  </v-flex>
+                                </v-layout>
+                                <v-layout wrap>
+                                  <v-flex xs12 sm6>
+                                    <v-layout>
+                                      <v-flex xs4 class="pt-4 subheading">
+                                        <label
+                                          class="right hidden-xs-only hidden-sm-only"
+                                        >Uplaod Image:</label>
+                                        <label
+                                          class="right hidden-lg-only hidden-md-only hidden-xl-only"
+                                        >Uplaod :</label>
+                                      </v-flex>
+                                      <v-flex xs8 class="ml-3">
+                                        <v-text-field
+                                          label="Select Image"
+                                          @click="pickFile"
+                                          v-model="imageName"
+                                          append-icon="attach_file"
+                                        ></v-text-field>
+                                      </v-flex>
+                                    </v-layout>
+                                  </v-flex>
+                                  <v-flex xs12 sm6>
+                                    <v-layout>
+                                      <v-flex xs4 class="pt-4 subheading">
+                                        <label
+                                          class="right hidden-xs-only hidden-sm-only"
+                                        >Academic Year:</label>
+                                        <label
+                                          class="right hidden-lg-only hidden-md-only hidden-xl-only"
+                                        >Year:</label>
+                                      </v-flex>
+                                      <v-flex xs8 class="ml-3">
+                                        <v-text-field
+                                          v-model="addStudents.establishmentYear"
+                                          placeholder="fill your Academic Year"
+                                          name="state"
+                                          type="number"
+                                          :rules="establishmentYearRules"
+                                          required
+                                        ></v-text-field>
+                                      </v-flex>
+                                    </v-layout>
+                                  </v-flex>
+                                </v-layout>
+                                <v-layout wrap>
+                                  <v-flex xs12 sm6>
+                                    <v-layout>
+                                      <v-flex xs4 class="pt-4 subheading">
+                                        <label
+                                          class="right hidden-xs-only hidden-sm-only"
+                                        >Roll Number:</label>
+                                        <label
+                                          class="right hidden-lg-only hidden-md-only hidden-xl-only"
+                                        >Roll No:</label>
+                                      </v-flex>
+                                      <v-flex xs8 class="ml-3">
+                                        <v-text-field
+                                          v-model="addStudents.rollNo"
+                                          placeholder="Fill your Roll Number"
+                                          required
+                                        ></v-text-field>
+                                      </v-flex>
+                                    </v-layout>
+                                  </v-flex>
+                                </v-layout>
+                                <v-layout class="hidden-xs-only hidden-sm-only" wrap>
+                                  <v-flex xs12 sm12>
+                                    <v-layout>
+                                      <v-flex xs4 sm2 class="pt-4 subheading ml-5">
+                                        <label class="right pr-4">Present Address:</label>
+                                      </v-flex>
+                                      <v-flex xs8 sm12>
+                                        <v-text-field
+                                          name="input-4-3"
+                                          v-model="addStudents.presentAddress"
+                                          :rules="presentAddress"
+                                          placeholder="fill Your present Address"
+                                          required
+                                        ></v-text-field>
+                                      </v-flex>
+                                    </v-layout>
+                                  </v-flex>
+                                  <v-flex xs12 sm12>
+                                    <v-layout>
+                                      <v-flex xs4 sm2 class="pt-4 subheading ml-5 addressForm">
+                                        <label class>Permanent Address:</label>
+                                      </v-flex>
+                                      <v-flex xs12 sm12>
+                                        <v-text-field
+                                          name="input-4-3"
+                                          v-model="addStudents.permanentAddress"
+                                          :rules="permanentAddress"
+                                          placeholder="fill Your Permanent Address"
+                                          required
+                                        ></v-text-field>
+                                      </v-flex>
+                                    </v-layout>
+                                  </v-flex>
+                                </v-layout>
+                                <v-layout class="hidden-lg-only hidden-md-only hidden-xl-only" wrap>
+                                  <v-flex xs12 sm12>
+                                    <v-layout>
+                                      <v-flex xs12 sm3 class="pt-4 subheading text-xs-center">
+                                        <label class>Present Address :</label>
+                                      </v-flex>
+                                    </v-layout>
+                                    <v-layout>
+                                      <v-flex xs12 sm12>
+                                        <v-textarea
+                                          name="input-4-3"
+                                          v-model="addStudents.presentAddress"
+                                          :rules="presentAddress"
+                                          placeholder="fill Your present Address"
+                                          required
+                                        ></v-textarea>
+                                      </v-flex>
+                                    </v-layout>
+                                  </v-flex>
+                                  <v-flex xs12 sm12>
+                                    <v-layout>
+                                      <v-flex
+                                        xs12
+                                        sm3
+                                        class="pt-4 pr-4 subheading text-xs-center addressForm"
+                                      >
+                                        <label>Permanent addr:</label>
+                                      </v-flex>
+                                    </v-layout>
+                                    <v-layout>
+                                      <v-flex xs12 sm12>
+                                        <v-textarea
+                                          name="input-4-3"
+                                          v-model="addStudents.permanentAddress"
+                                          :rules="permanentAddress"
+                                          placeholder="fill Your Permanent Address"
+                                          required
+                                        ></v-textarea>
+                                      </v-flex>
+                                    </v-layout>
+                                  </v-flex>
+                                </v-layout>
+                                <v-layout>
+                                  <v-flex xs12 sm12>
+                                    <v-layout>
+                                      <v-flex xs6>
+                                        <v-btn round dark @click="e2 = 1">Back</v-btn>
+                                      </v-flex>
+                                      <v-flex xs6>
+                                        <v-btn
+                                          @click="submit"
+                                          round
+                                          dark
+                                          :loading="loading"
+                                          class="right"
+                                        >Add</v-btn>
+                                      </v-flex>
+                                    </v-layout>
+                                  </v-flex>
+                                </v-layout>
+                              <!-- </v-container> -->
+                            </v-form>
+                          </v-flex>
                         <!-- </v-container> -->
                       </v-stepper-content>
                     </v-stepper-items>
diff --git a/src/pages/Subjects/subjects.vue b/src/pages/Subjects/subjects.vue
index e5cd778..f3bd58d 100644
--- a/src/pages/Subjects/subjects.vue
+++ b/src/pages/Subjects/subjects.vue
@@ -209,16 +209,6 @@
                   <v-flex xs12>
                     <v-form ref="form" v-model="valid" lazy-validation>
                       <v-layout>
-                        <v-flex
-                          xs12
-                          class="text-xs-center text-sm-center text-md-center text-lg-center my-4 mr-4"
-                        >
-                          <v-avatar size="100px">
-                            <img src="/static/icon/user.png" />
-                          </v-avatar>
-                        </v-flex>
-                      </v-layout>
-                      <v-layout>
                         <v-flex xs4 sm4 class="pt-4 subheading">
                           <label class="right">Class:</label>
                         </v-flex>
diff --git a/src/pages/Teachers/teachers.vue b/src/pages/Teachers/teachers.vue
index 81474f1..31b7256 100644
--- a/src/pages/Teachers/teachers.vue
+++ b/src/pages/Teachers/teachers.vue
@@ -34,327 +34,314 @@
               <v-spacer></v-spacer>
             </v-toolbar>
             <v-card-text style="height: 800px;">
-              <v-form ref="form">
-                <v-container fluid>
+              <v-layout>
+                <v-flex
+                  xs12
+                  class="text-xs-center text-sm-center text-md-center text-lg-center my-4"
+                >
+                  <v-avatar size="160px">
+                    <img src="/static/icon/user.png" v-if="!editedItem.profilePicUrl && !imageUrl" />
+                    <img
+                      :src="editedItem.profilePicUrl"
+                      v-else-if="editedItem.profilePicUrl && !imageUrl"
+                    />
+                    <img
+                      v-if="imageUrl"
+                      :src="imageUrl"
+                      height="150"
+                      style="border-radius:50%; width:200px"
+                    />
+                  </v-avatar>
+                  <input
+                    type="file"
+                    style="display:none"
+                    ref="image"
+                    accept="image/*"
+                    @change="onFilePicked"
+                  />
+                </v-flex>
+              </v-layout>
+              <v-layout wrap>
+                <v-flex xs12 sm6>
                   <v-layout>
-                    <v-flex
-                      xs12
-                      class="text-xs-center text-sm-center text-md-center text-lg-center my-4 mr-4"
-                    >
-                      <v-avatar size="160px">
-                        <img
-                          src="/static/icon/user.png"
-                          v-if="!editedItem.profilePicUrl && !imageUrl"
-                        />
-                        <img
-                          :src="editedItem.profilePicUrl"
-                          v-else-if="editedItem.profilePicUrl && !imageUrl"
-                        />
-                        <img
-                          v-if="imageUrl"
-                          :src="imageUrl"
-                          height="150"
-                          style="border-radius:50%; width:200px"
-                        />
-                      </v-avatar>
-                      <input
-                        type="file"
-                        style="display:none"
-                        ref="image"
-                        accept="image/*"
-                        @change="onFilePicked"
-                      />
+                    <v-flex xs4 sm4 class="pt-4 subheading">
+                      <label class="right hidden-xs-only hidden-sm-only">Full Name:</label>
+                      <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Name:</label>
+                    </v-flex>
+                    <v-flex xs8 sm6 class="ml-3">
+                      <v-text-field
+                        v-model="editedItem.name"
+                        placeholder="fill your full Name"
+                        type="text"
+                        required
+                      ></v-text-field>
                     </v-flex>
                   </v-layout>
+                </v-flex>
+                <v-flex xs12 sm6>
                   <v-layout>
-                    <v-flex xs12 sm6>
-                      <v-layout>
-                        <v-flex xs4 sm4 class="pt-4 subheading">
-                          <label class="right hidden-xs-only hidden-sm-only">Full Name:</label>
-                          <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Name:</label>
-                        </v-flex>
-                        <v-flex xs8 sm8 class="ml-3">
-                          <v-text-field
-                            v-model="editedItem.name"
-                            placeholder="fill your full Name"
-                            name="name"
-                            type="text"
-                            required
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
+                    <v-flex xs4 sm4 class="pt-4 subheading">
+                      <label class="right">Email ID:</label>
                     </v-flex>
-                    <v-flex xs12 sm6>
-                      <v-layout>
-                        <v-flex xs4 sm4 class="pt-4 subheading">
-                          <label class="right">Email ID:</label>
-                        </v-flex>
-                        <v-flex xs8 sm8 class="ml-3">
-                          <v-text-field
-                            placeholder="fill your email"
-                            v-model="editedItem.email"
-                            type="text"
-                            name="email"
-                            required
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
+                    <v-flex xs8 sm6  class="ml-3">
+                      <v-text-field
+                        placeholder="fill your email"
+                        v-model="editedItem.email"
+                        type="text"
+                        required
+                      ></v-text-field>
                     </v-flex>
                   </v-layout>
+                </v-flex>
+              </v-layout>
+              <v-layout wrap>
+                <v-flex xs12 sm6>
                   <v-layout>
-                    <v-flex xs12 sm6>
-                      <v-layout>
-                        <v-flex xs4 sm4 class="pt-4 subheading">
-                          <label class="right hidden-sm-only hidden-xs-only">Date of Birth:</label>
-                          <label class="right hidden-lg-only hidden-xl-only hidden-md-only">D.O.B:</label>
-                        </v-flex>
-                        <v-flex xs8 sm8 class="ml-3">
-                          <v-menu
-                            ref="menu"
-                            :close-on-content-click="false"
-                            v-model="menu2"
-                            :nudge-right="40"
-                            lazy
-                            transition="scale-transition"
-                            offset-y
-                            full-width
-                            min-width="290px"
-                          >
-                            <v-text-field
-                              slot="activator"
-                              v-model="editedItem.dob"
-                              placeholder="Select date"
-                            ></v-text-field>
-                            <v-date-picker
-                              ref="picker"
-                              v-model="editedItem.dob"
-                              :max="new Date().toISOString().substr(0, 10)"
-                              min="1950-01-01"
-                              @input="menu2 = false"
-                            ></v-date-picker>
-                          </v-menu>
-                        </v-flex>
-                      </v-layout>
+                    <v-flex xs4 sm4 class="pt-4 subheading">
+                      <label class="right hidden-sm-only hidden-xs-only">Date of Birth:</label>
+                      <label class="right hidden-lg-only hidden-xl-only hidden-md-only">D.O.B:</label>
                     </v-flex>
-                    <v-flex xs12 sm6>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">City:</label>
-                        </v-flex>
-                        <v-flex xs8 class="ml-3">
-                          <v-text-field
-                            v-model="editedItem.city"
-                            placeholder="fill your City Name"
-                            name="City"
-                            type="text"
-                            required
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
+                    <v-flex xs8 sm6 class="ml-3">
+                      <v-menu
+                        ref="menu"
+                        :close-on-content-click="false"
+                        v-model="menu2"
+                        :nudge-right="40"
+                        lazy
+                        transition="scale-transition"
+                        offset-y
+                        full-width
+                        min-width="290px"
+                      >
+                        <v-text-field
+                          slot="activator"
+                          v-model="editedItem.dob"
+                          placeholder="Select date"
+                        ></v-text-field>
+                        <v-date-picker
+                          ref="picker"
+                          v-model="editedItem.dob"
+                          :max="new Date().toISOString().substr(0, 10)"
+                          min="1950-01-01"
+                          @input="menu2 = false"
+                        ></v-date-picker>
+                      </v-menu>
                     </v-flex>
                   </v-layout>
+                </v-flex>
+                <v-flex xs12 sm6>
                   <v-layout>
-                    <v-flex xs12 sm6>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">State:</label>
-                        </v-flex>
-                        <v-flex xs8 class="ml-3">
-                          <v-text-field
-                            v-model="editedItem.state"
-                            placeholder="fill your State Name"
-                            name="state"
-                            type="text"
-                            required
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
+                    <v-flex xs4 class="pt-4 subheading">
+                      <label class="right">City:</label>
                     </v-flex>
-                    <v-flex xs12 sm6>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">PinCode:</label>
-                        </v-flex>
-                        <v-flex xs8 class="ml-3">
-                          <v-text-field
-                            v-model="editedItem.pincode"
-                            placeholder="fill your pincode"
-                            name="pincode"
-                            type="number"
-                            required
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
+                    <v-flex xs8 sm6 class="ml-3">
+                      <v-text-field
+                        v-model="editedItem.city"
+                        placeholder="fill your City Name"
+                        type="text"
+                        required
+                      ></v-text-field>
                     </v-flex>
                   </v-layout>
+                </v-flex>
+              </v-layout>
+              <v-layout wrap>
+                <v-flex xs12 sm6>
                   <v-layout>
-                    <v-flex xs12 sm6>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right hidden-xs-only hidden-sm-only">Mobile No:</label>
-                          <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Mobile:</label>
-                        </v-flex>
-                        <v-flex xs8 class="ml-3">
-                          <v-text-field
-                            v-model="editedItem.mobileNo"
-                            placeholder="fill your MobileNo"
-                            name="mobileNo"
-                            type="number"
-                            required
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
+                    <v-flex xs4 class="pt-4 subheading">
+                      <label class="right">State:</label>
                     </v-flex>
-                    <v-flex xs12 sm6>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right hidden-xs-only hidden-sm-only">Select Country:</label>
-                          <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Country:</label>
-                        </v-flex>
-                        <v-flex xs8 class="ml-3">
-                          <v-autocomplete
-                            v-model="editedItem.country"
-                            :items="countries"
-                            placeholder="Select Country Name"
-                            required
-                          ></v-autocomplete>
-                        </v-flex>
-                      </v-layout>
+                    <v-flex xs8 sm6 class="ml-3">
+                      <v-text-field
+                        v-model="editedItem.state"
+                        placeholder="fill your State Name"
+                        type="text"
+                        required
+                      ></v-text-field>
                     </v-flex>
                   </v-layout>
+                </v-flex>
+                <v-flex xs12 sm6>
                   <v-layout>
-                    <v-flex xs12 sm6>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Join Date:</label>
-                        </v-flex>
-                        <v-flex xs8 class="ml-3">
-                          <v-menu
-                            ref="menu"
-                            :close-on-content-click="false"
-                            v-model="menu3"
-                            :nudge-right="40"
-                            lazy
-                            transition="scale-transition"
-                            offset-y
-                            full-width
-                            min-width="290px"
-                          >
-                            <v-text-field
-                              slot="activator"
-                              v-model="editedItem.joinDate"
-                              placeholder="Select date"
-                            ></v-text-field>
-                            <v-date-picker
-                              ref="picker"
-                              v-model="editedItem.joinDate"
-                              :max="new Date().toISOString().substr(0, 10)"
-                              min="1950-01-01"
-                              @input="menu3 = false"
-                            ></v-date-picker>
-                          </v-menu>
-                        </v-flex>
-                      </v-layout>
+                    <v-flex xs4 class="pt-4 subheading">
+                      <label class="right">PinCode:</label>
                     </v-flex>
-                    <v-flex xs12 sm6>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right hidden-xs-only hidden-sm-only">Uplaod Image:</label>
-                          <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Uplaod :</label>
-                        </v-flex>
-                        <v-flex xs8 class="ml-3">
-                          <v-text-field
-                            label="Select Image"
-                            @click="pickFile"
-                            v-model="imageName"
-                            append-icon="attach_file"
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
+                    <v-flex xs8 sm6 class="ml-3">
+                      <v-text-field
+                        v-model="editedItem.pincode"
+                        placeholder="fill your pincode"
+                        type="number"
+                        required
+                      ></v-text-field>
                     </v-flex>
                   </v-layout>
-                  <v-layout class="hidden-xs-only hidden-sm-only">
-                    <v-flex xs12 sm12>
-                      <v-layout>
-                        <v-flex xs4 sm2 class="pt-4 subheading ml-5">
-                          <label class="right pr-4">Present Address:</label>
-                        </v-flex>
-                        <v-flex xs8 sm12>
-                          <v-text-field
-                            name="input-4-3"
-                            v-model="editedItem.presentAddress"
-                            placeholder="fill Your present Address"
-                            required
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
+                </v-flex>
+              </v-layout>
+              <v-layout wrap>
+                <v-flex xs12 sm6>
+                  <v-layout>
+                    <v-flex xs4 class="pt-4 subheading">
+                      <label class="right hidden-xs-only hidden-sm-only">Mobile No:</label>
+                      <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Mobile:</label>
                     </v-flex>
-                    <v-flex xs12 sm12>
-                      <v-layout>
-                        <v-flex xs4 sm2 class="pt-4 subheading ml-5 addressForm">
-                          <label class>Permanent Address:</label>
-                        </v-flex>
-                        <v-flex xs12 sm12>
-                          <v-text-field
-                            name="input-4-3"
-                            v-model="editedItem.permanentAddress"
-                            placeholder="fill Your Permanent Address"
-                            required
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
+                    <v-flex xs8 sm6 class="ml-3">
+                      <v-text-field
+                        v-model="editedItem.mobileNo"
+                        placeholder="fill your MobileNo"
+                        type="number"
+                        required
+                      ></v-text-field>
                     </v-flex>
                   </v-layout>
-                  <v-layout class="hidden-lg-only hidden-md-only hidden-xl-only">
-                    <v-flex xs12 sm12>
-                      <v-layout>
-                        <v-flex xs12 sm3 class="pt-4 subheading text-xs-center">
-                          <label class>Present Address :</label>
-                        </v-flex>
-                      </v-layout>
-                      <v-layout>
-                        <v-flex xs12 sm12>
-                          <v-textarea
-                            name="input-4-3"
-                            v-model="editedItem.presentAddress"
-                            placeholder="fill Your present Address"
-                            required
-                          ></v-textarea>
-                        </v-flex>
-                      </v-layout>
+                </v-flex>
+                <v-flex xs12 sm6>
+                  <v-layout>
+                    <v-flex xs4 class="pt-4 subheading">
+                      <label class="right hidden-xs-only hidden-sm-only">Select Country:</label>
+                      <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Country:</label>
+                    </v-flex>
+                    <v-flex xs8 sm6 class="ml-3">
+                      <v-autocomplete
+                        v-model="editedItem.country"
+                        :items="countries"
+                        placeholder="Select Country Name"
+                        required
+                      ></v-autocomplete>
+                    </v-flex>
+                  </v-layout>
+                </v-flex>
+              </v-layout>
+              <v-layout wrap>
+                <v-flex xs12 sm6>
+                  <v-layout>
+                    <v-flex xs4 class="pt-4 subheading">
+                      <label class="right">Join Date:</label>
+                    </v-flex>
+                    <v-flex xs8 sm6 class="ml-3">
+                      <v-menu
+                        ref="menu"
+                        :close-on-content-click="false"
+                        v-model="menu3"
+                        :nudge-right="40"
+                        lazy
+                        transition="scale-transition"
+                        offset-y
+                        full-width
+                        min-width="290px"
+                      >
+                        <v-text-field
+                          slot="activator"
+                          v-model="editedItem.joinDate"
+                          placeholder="Select date"
+                        ></v-text-field>
+                        <v-date-picker
+                          ref="picker"
+                          v-model="editedItem.joinDate"
+                          :max="new Date().toISOString().substr(0, 10)"
+                          min="1950-01-01"
+                          @input="menu3 = false"
+                        ></v-date-picker>
+                      </v-menu>
+                    </v-flex>
+                  </v-layout>
+                </v-flex>
+                <v-flex xs12 sm6>
+                  <v-layout>
+                    <v-flex xs4 class="pt-4 subheading">
+                      <label class="right hidden-xs-only hidden-sm-only">Uplaod Image:</label>
+                      <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Uplaod :</label>
+                    </v-flex>
+                    <v-flex xs8  sm6 class="ml-3">
+                      <v-text-field
+                        label="Select Image"
+                        @click="pickFile"
+                        v-model="imageName"
+                        append-icon="attach_file"
+                      ></v-text-field>
+                    </v-flex>
+                  </v-layout>
+                </v-flex>
+              </v-layout>
+              <v-layout class="hidden-xs-only hidden-sm-only" wrap>
+                <v-flex xs12 sm12>
+                  <v-layout>
+                    <v-flex xs4 sm2 class="pt-4 subheading ml-5">
+                      <label class="right pr-2">Present Address:</label>
+                    </v-flex>
+                    <v-flex xs8 sm10>
+                      <v-text-field
+                        name="input-4-3"
+                        v-model="editedItem.presentAddress"
+                        placeholder="fill Your present Address"
+                        required
+                      ></v-text-field>
+                    </v-flex>
+                  </v-layout>
+                </v-flex>
+                <v-flex xs12 sm12>
+                  <v-layout>
+                    <v-flex xs4 sm2 class="pt-4 subheading ml-5 addressForm">
+                      <label class="pr-2">Permanent Address:</label>
                     </v-flex>
+                    <v-flex xs12 sm10>
+                      <v-text-field
+                        name="input-4-3"
+                        v-model="editedItem.permanentAddress"
+                        placeholder="fill Your Permanent Address"
+                        required
+                      ></v-text-field>
+                    </v-flex>
+                  </v-layout>
+                </v-flex>
+              </v-layout>
+              <v-layout class="hidden-lg-only hidden-md-only hidden-xl-only" wrap>
+                <v-flex xs12 sm12>
+                  <v-layout>
+                    <v-flex xs12 sm3 class="pt-4 subheading text-xs-center">
+                      <label class>Present Address:</label>
+                    </v-flex>
+                  </v-layout>
+                  <v-layout>
                     <v-flex xs12 sm12>
-                      <v-layout>
-                        <v-flex xs12 sm3 class="pt-4 pr-4 subheading text-xs-center addressForm">
-                          <label>Permanent addr:</label>
-                        </v-flex>
-                      </v-layout>
-                      <v-layout>
-                        <v-flex xs12 sm12>
-                          <v-textarea
-                            name="input-4-3"
-                            v-model="editedItem.permanentAddress"
-                            placeholder="fill Your Permanent Address"
-                            required
-                          ></v-textarea>
-                        </v-flex>
-                      </v-layout>
+                      <v-textarea
+                        name="input-4-3"
+                        v-model="editedItem.presentAddress"
+                        placeholder="fill Your present Address"
+                        required
+                      ></v-textarea>
                     </v-flex>
                   </v-layout>
-                   <v-layout>
+                </v-flex>
+                <v-flex xs12 sm12>
+                  <v-layout>
+                    <v-flex xs12 sm3 class="pt-4 pr-4 subheading text-xs-center addressForm">
+                      <label>Permanent Address:</label>
+                    </v-flex>
+                  </v-layout>
+                  <v-layout>
                     <v-flex xs12 sm12>
-                      <v-layout>
-                        <v-flex xs6>
-                           <v-btn round dark @click.native="close">Cancel</v-btn>
-                        </v-flex>
-                        <v-flex xs6>
-                          <v-btn @click="save" round dark :loading="loading" class="right">Save</v-btn>
-                        </v-flex>
-                      </v-layout>
+                      <v-textarea
+                        name="input-4-3"
+                        v-model="editedItem.permanentAddress"
+                        placeholder="fill Your Permanent Address"
+                        required
+                      ></v-textarea>
                     </v-flex>
                   </v-layout>
-                </v-container>
-              </v-form>
+                </v-flex>
+              </v-layout>
+              <v-layout>
+                <v-flex xs12 sm12>
+                  <v-layout>
+                    <v-flex xs6>
+                      <v-btn round dark @click.native="close">Cancel</v-btn>
+                    </v-flex>
+                    <v-flex xs6>
+                      <v-btn @click="save" round dark :loading="loading" class="right">Save</v-btn>
+                    </v-flex>
+                  </v-layout>
+                </v-flex>
+              </v-layout>
             </v-card-text>
           </v-card>
         </v-dialog>
@@ -577,7 +564,7 @@
                   <v-layout>
                     <v-flex
                       xs12
-                      class="text-xs-center text-sm-center text-md-center text-lg-center my-4 mr-4"
+                      class="text-xs-center text-sm-center text-md-center text-lg-center my-4"
                     >
                       <v-avatar size="100px">
                         <img src="/static/icon/user.png" v-if="!imageUrl" />
@@ -726,7 +713,7 @@
                         <v-flex xs8 class="ml-3">
                           <v-text-field
                             v-model="addTeachers.mobileNo"
-                            placeholder="fill your MobileNo"
+                            placeholder="fill your Mobile No."
                             name="mobileNo"
                             type="number"
                             :rules="mobileNoRules"
@@ -757,7 +744,7 @@
                     <v-flex xs12 sm6>
                       <v-layout>
                         <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Join Date</label>
+                          <label class="right">Join Date:</label>
                         </v-flex>
                         <v-flex xs8 class="ml-3">
                           <v-menu
@@ -792,7 +779,7 @@
                       <v-layout>
                         <v-flex xs4 class="pt-4 subheading">
                           <label class="right hidden-xs-only hidden-sm-only">Uplaod Image:</label>
-                          <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Uplaod :</label>
+                          <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Uplaod:</label>
                         </v-flex>
                         <v-flex xs8 class="ml-3">
                           <v-text-field
@@ -812,40 +799,6 @@
                       </v-layout>
                     </v-flex>
                   </v-layout>
-                  <!-- <v-layout>
-                    <v-flex xs12 sm12>
-                      <v-layout>
-                        <v-flex xs3 class="pt-4 subheading pl-4" style="max-width: 17%;">
-                          <label class>Present Address:</label>
-                        </v-flex>
-                        <v-flex xs12 class="presentInput">
-                          <v-text-field
-                            name="input-4-3"
-                            v-model="addTeachers.presentAddress"
-                            :rules="presentAddress"
-                            placeholder="fill Your present Address"
-                            required
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
-                    </v-flex>
-                    <v-flex xs12 sm12>
-                      <v-layout>
-                        <v-flex xs3 class="pt-4 subheading" style="max-width: 17%;">
-                          <label>Permanent Address:</label>
-                        </v-flex>
-                        <v-flex xs12 class="presentInput">
-                          <v-text-field
-                            name="input-4-3"
-                            v-model="addTeachers.permanentAddress"
-                            :rules="permanentAddress"
-                            placeholder="fill Your Permanent Address"
-                            required
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
-                    </v-flex>
-                  </v-layout>-->
                   <v-layout class="hidden-xs-only hidden-sm-only">
                     <v-flex xs12 sm12>
                       <v-layout>
@@ -884,7 +837,7 @@
                     <v-flex xs12 sm12>
                       <v-layout>
                         <v-flex xs12 sm3 class="pt-4 subheading text-xs-center">
-                          <label class>Present Address :</label>
+                          <label class>Present Addres:</label>
                         </v-flex>
                       </v-layout>
                       <v-layout>
@@ -902,7 +855,7 @@
                     <v-flex xs12 sm12>
                       <v-layout>
                         <v-flex xs12 sm3 class="pt-4 pr-4 subheading text-xs-center addressForm">
-                          <label>Permanent addr:</label>
+                          <label>Permanent Address:</label>
                         </v-flex>
                       </v-layout>
                       <v-layout>
diff --git a/src/pages/TimeTable/timeTable.vue b/src/pages/TimeTable/timeTable.vue
index a9b3338..5e501fb 100644
--- a/src/pages/TimeTable/timeTable.vue
+++ b/src/pages/TimeTable/timeTable.vue
@@ -28,8 +28,8 @@
           v-model="snackbar"
           color="success"
         >{{ text }}</v-snackbar>
-        <v-dialog v-model="dialog" max-width="1000px">
-          <v-flex xs12 sm12 class>
+        <v-dialog v-model="dialog" max-width="600px">
+          <v-flex xs12 sm12>
             <v-toolbar color="grey lighten-2">
               <v-spacer></v-spacer>
               <v-toolbar-title>
@@ -37,77 +37,73 @@
               </v-toolbar-title>
               <v-spacer></v-spacer>
             </v-toolbar>
-            <v-card flat>
-              <v-form ref="form">
-                <v-container fluid>
-                  <v-layout>
-                    <v-flex
-                      xs12
-                      class="text-xs-center text-sm-center text-md-center text-lg-center mr-4"
-                    >
-                      <v-avatar size="100px">
-                        <img src="/static/icon/user.png" v-if="!imageUrl" />
-                      </v-avatar>
-                      <input
-                        type="file"
-                        style="display: none"
-                        ref="image"
-                        accept="image/*"
-                        @change="onFilePicked"
-                      />
-                      <img
-                        :src="imageData.imageUrl"
-                        height="150"
-                        v-if="imageUrl"
-                        style="border-radius:50%; width:200px"
-                      />
-                    </v-flex>
-                  </v-layout>
-                  <v-flex xs12 sm12>
-                    <v-layout>
-                      <v-flex xs4 class="pt-4 subheading">
-                        <label class="right">class No:</label>
-                      </v-flex>
-                      <v-flex xs12 sm5 class="ml-3">
-                        <v-select
-                          :items="addclass"
-                          label="Select Class"
-                          v-model="editedItem.classNum"
-                          item-text="classNum"
-                          item-value="_id"
-                          @change="getSections(editedItem.classNum)"
-                        ></v-select>
-                      </v-flex>
-                    </v-layout>
+            <v-card flat class="pa-2">
+              <!-- <v-layout>
+                <v-flex
+                  xs12
+                  class="text-xs-center text-sm-center text-md-center text-lg-center"
+                >
+                  <v-avatar size="100px">
+                    <img src="/static/icon/user.png" v-if="!imageUrl" />
+                  </v-avatar>
+                  <input
+                    type="file"
+                    style="display: none"
+                    ref="image"
+                    accept="image/*"
+                    @change="onFilePicked"
+                  />
+                  <img
+                    :src="imageData.imageUrl"
+                    height="150"
+                    v-if="imageUrl"
+                    style="border-radius:50%; width:200px"
+                  />
+                </v-flex>
+              </v-layout>-->
+              <v-flex xs12 sm12>
+                <v-layout>
+                  <v-flex xs4 class="pt-4 subheading">
+                    <label class="right">class No:</label>
                   </v-flex>
-                  <v-flex xs12 sm12>
-                    <v-layout>
-                      <v-flex xs4 class="pt-4 subheading">
-                        <label class="right hidden-xs-only hidden-sm-only">Section Name:</label>
-                        <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Section:</label>
-                      </v-flex>
-                      <v-flex xs5 class="ml-3">
-                        <v-select
-                          :items="addSection"
-                          label="Select Section"
-                          v-model="editedItem.selectSection"
-                          item-text="name"
-                          item-value="_id"
-                        ></v-select>
-                      </v-flex>
-                    </v-layout>
+                  <v-flex xs8 sm5 class="ml-3">
+                    <v-select
+                      :items="addclass"
+                      label="Select Class"
+                      v-model="editedItem.classNum"
+                      item-text="classNum"
+                      item-value="_id"
+                      @change="getSections(editedItem.classNum)"
+                    ></v-select>
                   </v-flex>
-                  <v-layout>
-                    <v-flex xs12 sm8 offset-sm2>
-                      <v-card-actions>
-                        <v-btn round dark @click.native="close">Cancel</v-btn>
-                        <v-spacer></v-spacer>
-                        <v-btn round dark @click="save">Save</v-btn>
-                      </v-card-actions>
-                    </v-flex>
-                  </v-layout>
-                </v-container>
-              </v-form>
+                </v-layout>
+              </v-flex>
+              <v-flex xs12 sm12>
+                <v-layout>
+                  <v-flex xs4 class="pt-4 subheading">
+                    <label class="right hidden-xs-only hidden-sm-only">Section Name:</label>
+                    <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Section:</label>
+                  </v-flex>
+                  <v-flex xs8 sm5 class="ml-3">
+                    <v-select
+                      :items="addSection"
+                      label="Select Section"
+                      v-model="editedItem.selectSection"
+                      item-text="name"
+                      item-value="_id"
+                    ></v-select>
+                  </v-flex>
+                </v-layout>
+              </v-flex>
+              <v-layout>
+                <v-flex xs12 sm9 offset-sm1>
+                  <v-card-actions>
+                    <v-btn round dark @click.native="close">Cancel</v-btn>
+                    <v-spacer></v-spacer>
+                    <v-btn round dark @click="save">Save</v-btn>
+                  </v-card-actions>
+                </v-flex>
+              </v-layout>
             </v-card>
           </v-flex>
         </v-dialog>
@@ -132,7 +128,7 @@
                         <label class="right hidden-xs-only hidden-sm-only">Select Day:</label>
                         <label class="right hidden-lg-only hidden-md-only hidden-xl-only">Day:</label>
                       </v-flex>
-                      <v-flex xs12 sm5 class="ml-3">
+                      <v-flex xs12 sm5 class="pl-3">
                         <v-select
                           :items="addOneDay"
                           label="Select Day"
@@ -279,120 +275,116 @@
 
         <!-- ****** EDIT PARTICULAR LECTURES TIME-TABLE ******  -->
 
-        <v-dialog v-model="dialogUpdateLectures" max-width="1000px">
+        <v-dialog v-model="dialogUpdateLectures" max-width="600px">
           <v-flex xs12 sm12 class>
             <v-toolbar color="grey lighten-2">
               <v-spacer></v-spacer>
               <v-toolbar-title>Edit Lecture</v-toolbar-title>
               <v-spacer></v-spacer>
             </v-toolbar>
-            <v-card flat>
-              <v-form ref="form">
-                <v-container fluid>
-                  <v-flex xs12 sm12>
-                    <v-layout>
-                      <v-flex xs4 class="pt-4 subheading">
-                        <label class="right">Subject Name:</label>
-                      </v-flex>
-                      <v-flex xs5 class="ml-3">
-                        <v-text-field
-                          v-model="updateLectures.subjectName"
-                          placeholder="fill your Subject Name"
-                          type="text"
-                        ></v-text-field>
-                      </v-flex>
-                    </v-layout>
+            <v-card flat class="pa-2">
+              <v-flex xs12 sm12>
+                <v-layout>
+                  <v-flex xs5 sm4 class="pt-4 subheading">
+                    <label class="right">Subject Name:</label>
                   </v-flex>
-                  <v-flex xs12 sm12>
-                    <v-layout>
-                      <v-flex xs4 class="pt-4 subheading">
-                        <label class="right">Time In:</label>
-                      </v-flex>
-                      <v-flex xs5 class="ml-3">
-                        <v-menu
-                          ref="menuC"
-                          :close-on-content-click="false"
-                          v-model="menu4"
-                          :nudge-right="40"
-                          lazy
-                          transition="scale-transition"
-                          offset-y
-                          full-width
-                          max-width="290px"
-                          min-width="290px"
-                        >
-                          <v-text-field
-                            slot="activator"
-                            v-model="updateLectures.timeIn"
-                            placeholder="Select your Time In"
-                            append-icon="access_time"
-                          ></v-text-field>
-                          <v-time-picker v-model="updateLectures.timeIn" @change="menu4= false"></v-time-picker>
-                        </v-menu>
-                      </v-flex>
-                    </v-layout>
+                  <v-flex xs7 sm6 class="ml-3">
+                    <v-text-field
+                      v-model="updateLectures.subjectName"
+                      placeholder="fill your Subject Name"
+                      type="text"
+                    ></v-text-field>
                   </v-flex>
-                  <v-flex xs12 sm12>
-                    <v-layout>
-                      <v-flex xs4 class="pt-4 subheading">
-                        <label class="right">Time Out:</label>
-                      </v-flex>
-                      <v-flex xs5 class="ml-3">
-                        <v-menu
-                          ref="menuB"
-                          :close-on-content-click="false"
-                          v-model="menu3"
-                          :nudge-right="40"
-                          lazy
-                          transition="scale-transition"
-                          offset-y
-                          full-width
-                          max-width="290px"
-                          min-width="290px"
-                        >
-                          <v-text-field
-                            slot="activator"
-                            v-model="updateLectures.timeOut"
-                            placeholder="Select your Time Out"
-                            append-icon="access_time"
-                          ></v-text-field>
-                          <v-time-picker v-model="updateLectures.timeOut" @change="menu3 = false"></v-time-picker>
-                        </v-menu>
-                      </v-flex>
-                    </v-layout>
+                </v-layout>
+              </v-flex>
+              <v-flex xs12 sm12>
+                <v-layout>
+                  <v-flex xs5 sm4 class="pt-4 subheading">
+                    <label class="right">Time In:</label>
                   </v-flex>
-                  <v-flex xs12 sm12>
-                    <v-layout>
-                      <v-flex xs4 class="pt-4 subheading">
-                        <label class="right">Select Teacher:</label>
-                      </v-flex>
-                      <v-flex xs5 class="ml-3">
-                        <v-select
-                          :items="addTeachers"
-                          label="Select Teacher"
-                          v-model="updateLectures.teacherId"
-                          item-text="name"
-                          item-value="_id"
-                          required
-                        ></v-select>
-                      </v-flex>
-                    </v-layout>
+                  <v-flex xs7 sm6 class="ml-3">
+                    <v-menu
+                      ref="menuC"
+                      :close-on-content-click="false"
+                      v-model="menu4"
+                      :nudge-right="40"
+                      lazy
+                      transition="scale-transition"
+                      offset-y
+                      full-width
+                      max-width="290px"
+                      min-width="290px"
+                    >
+                      <v-text-field
+                        slot="activator"
+                        v-model="updateLectures.timeIn"
+                        placeholder="Select your Time In"
+                        append-icon="access_time"
+                      ></v-text-field>
+                      <v-time-picker v-model="updateLectures.timeIn" @change="menu4= false"></v-time-picker>
+                    </v-menu>
                   </v-flex>
-                  <v-layout>
-                    <v-flex xs12 sm8 offset-sm2>
-                      <v-card-actions>
-                        <v-btn round dark @click.native="closeUpdateLectures">Cancel</v-btn>
-                        <v-spacer></v-spacer>
-                        <v-btn
-                          round
-                          dark
-                          @click="updateParticularTable(updateLectures.timeIn,updateLectures.timeOut)"
-                        >Save</v-btn>
-                      </v-card-actions>
-                    </v-flex>
-                  </v-layout>
-                </v-container>
-              </v-form>
+                </v-layout>
+              </v-flex>
+              <v-flex xs12 sm12>
+                <v-layout>
+                  <v-flex xs5 sm4 class="pt-4 subheading">
+                    <label class="right">Time Out:</label>
+                  </v-flex>
+                  <v-flex xs7 sm6 class="ml-3">
+                    <v-menu
+                      ref="menuB"
+                      :close-on-content-click="false"
+                      v-model="menu3"
+                      :nudge-right="40"
+                      lazy
+                      transition="scale-transition"
+                      offset-y
+                      full-width
+                      max-width="290px"
+                      min-width="290px"
+                    >
+                      <v-text-field
+                        slot="activator"
+                        v-model="updateLectures.timeOut"
+                        placeholder="Select your Time Out"
+                        append-icon="access_time"
+                      ></v-text-field>
+                      <v-time-picker v-model="updateLectures.timeOut" @change="menu3 = false"></v-time-picker>
+                    </v-menu>
+                  </v-flex>
+                </v-layout>
+              </v-flex>
+              <v-flex xs12 sm12>
+                <v-layout>
+                  <v-flex xs5 sm4 class="pt-4 subheading">
+                    <label class="right">Select Teacher:</label>
+                  </v-flex>
+                  <v-flex xs7 sm6 class="ml-3">
+                    <v-select
+                      :items="addTeachers"
+                      label="Select Teacher"
+                      v-model="updateLectures.teacherId"
+                      item-text="name"
+                      item-value="_id"
+                      required
+                    ></v-select>
+                  </v-flex>
+                </v-layout>
+              </v-flex>
+              <v-layout>
+                <v-flex xs12 sm10 offset-sm1>
+                  <v-card-actions>
+                    <v-btn round dark @click.native="closeUpdateLectures">Cancel</v-btn>
+                    <v-spacer></v-spacer>
+                    <v-btn
+                      round
+                      dark
+                      @click="updateParticularTable(updateLectures.timeIn,updateLectures.timeOut)"
+                    >Save</v-btn>
+                  </v-card-actions>
+                </v-flex>
+              </v-layout>
             </v-card>
           </v-flex>
         </v-dialog>
diff --git a/src/pages/User/user.vue b/src/pages/User/user.vue
index 3b7f670..77e2158 100644
--- a/src/pages/User/user.vue
+++ b/src/pages/User/user.vue
@@ -34,255 +34,251 @@
               <v-spacer></v-spacer>
             </v-toolbar>
             <v-card-text style="height: 680px;">
-              <v-form ref="form">
-                <v-container fluid>
-                  <v-layout>
-                    <v-flex
-                      xs12
-                      class="text-xs-center text-sm-center text-md-center text-lg-center my-4 mr-4"
-                    >
-                      <v-avatar size="160px">
-                        <img
-                          src="/static/icon/user.png"
-                          v-if="!editedItem.profilePicUrl && !imageUrl"
-                        />
-                        <img
-                          :src="editedItem.profilePicUrl"
-                          v-else-if="editedItem.profilePicUrl && !imageUrl"
-                        />
-                        <img
-                          v-if="imageUrl"
-                          :src="imageUrl"
-                          height="150"
-                          style="border-radius:50%; width:200px"
-                        />
-                      </v-avatar>
-                      <input
-                        type="file"
-                        style="display:none"
-                        ref="image"
-                        accept="image/*"
-                        @change="onFilePicked"
+                <v-layout>
+                  <v-flex
+                    xs12
+                    class="text-xs-center text-sm-center text-md-center text-lg-center my-4"
+                  >
+                    <v-avatar size="160px">
+                      <img
+                        src="/static/icon/user.png"
+                        v-if="!editedItem.profilePicUrl && !imageUrl"
                       />
-                    </v-flex>
-                  </v-layout>
-                  <v-layout>
-                    <v-flex xs12 sm6>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Name:</label>
-                        </v-flex>
-                        <v-flex xs8 class="ml-3">
-                          <v-text-field
-                            v-model="editedItem.name"
-                            placeholder="fill your Name"
-                            name="name"
-                            type="text"
-                            required
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
-                    </v-flex>
-                    <v-flex xs12 sm6>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Email ID:</label>
-                        </v-flex>
-                        <v-flex xs8 class="ml-3">
-                          <v-text-field
-                            placeholder="fill your email"
-                            v-model="editedItem.email"
-                            type="text"
-                            name="email"
-                            required
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
-                    </v-flex>
-                  </v-layout>
-                  <v-layout>
-                    <v-flex xs12 sm6>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right hidden-sm-only hidden-xs-only">Date of Birth:</label>
-                          <label class="right hidden-lg-only hidden-xl-only hidden-md-only">D.O.B:</label>
-                        </v-flex>
-                        <v-flex xs8 class="ml-3">
-                          <v-menu
-                            ref="menu"
-                            :close-on-content-click="false"
-                            v-model="menu2"
-                            :nudge-right="40"
-                            lazy
-                            transition="scale-transition"
-                            offset-y
-                            full-width
-                            min-width="290px"
-                          >
-                            <v-text-field
-                              slot="activator"
-                              v-model="editedItem.dob"
-                              placeholder="Select date"
-                            ></v-text-field>
-                            <v-date-picker
-                              ref="picker"
-                              v-model="editedItem.dob"
-                              :max="new Date().toISOString().substr(0, 10)"
-                              min="1950-01-01"
-                              @input="menu2 = false"
-                            ></v-date-picker>
-                          </v-menu>
-                        </v-flex>
-                      </v-layout>
-                    </v-flex>
-                    <v-flex xs12 sm6>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Gender:</label>
-                        </v-flex>
-                        <v-flex xs8 class="ml-3">
-                          <v-select
-                            :items="gender"
-                            v-model="editedItem.gender"
-                            label="Select gender"
-                            name="gender"
-                            required
-                          ></v-select>
-                        </v-flex>
-                      </v-layout>
-                    </v-flex>
-                  </v-layout>
-                  <v-layout>
-                    <v-flex xs12 sm6>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Religion:</label>
-                        </v-flex>
-                        <v-flex xs8 class="ml-3">
-                          <v-text-field
-                            v-model="editedItem.religion"
-                            placeholder="fill your Religion"
-                            name="religion"
-                            type="text"
-                            required
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
-                    </v-flex>
-                    <v-flex xs12 sm6>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Joining Date:</label>
-                        </v-flex>
-                        <v-flex xs8 class="ml-3">
-                          <v-menu
-                            ref="menu"
-                            :close-on-content-click="false"
-                            v-model="menu3"
-                            :nudge-right="40"
-                            lazy
-                            transition="scale-transition"
-                            offset-y
-                            full-width
-                            min-width="290px"
-                          >
-                            <v-text-field
-                              slot="activator"
-                              v-model="editedItem.joiningDate"
-                              placeholder="Select date"
-                            ></v-text-field>
-                            <v-date-picker
-                              ref="picker"
-                              v-model="editedItem.joiningDate"
-                              :max="new Date().toISOString().substr(0, 10)"
-                              min="1950-01-01"
-                              @input="menu3 = false"
-                            ></v-date-picker>
-                          </v-menu>
-                        </v-flex>
-                      </v-layout>
-                    </v-flex>
-                  </v-layout>
-                  <v-layout>
-                    <v-flex xs12 sm6>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Phone:</label>
-                        </v-flex>
-                        <v-flex xs8 class="ml-3">
-                          <v-text-field
-                            v-model="editedItem.phone"
-                            placeholder="fill your MobileNo"
-                            name="mobileNo"
-                            type="number"
-                            required
-                          ></v-text-field>
-                        </v-flex>
-                      </v-layout>
-                    </v-flex>
-                    <v-flex xs12 sm6>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right hidden-sm-only hidden-xs-only">Select Role:</label>
-                          <label class="right hidden-lg-only hidden-xl-only hidden-md-only">Role:</label>
-                        </v-flex>
-                        <v-flex xs8 class="ml-3">
-                          <v-autocomplete
-                            v-model="editedItem.role"
-                            :label="editedItem.role"
-                            :items="userRole"
-                            item-text="name"
-                            item-value="role"
-                            required
-                          ></v-autocomplete>
-                        </v-flex>
-                      </v-layout>
-                    </v-flex>
-                  </v-layout>
-                  <v-layout>
-                    <v-flex xs12 sm6>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                           <label class="right hidden-sm-only hidden-xs-only">Uplaod Image:</label>
-                          <label class="right hidden-lg-only hidden-xl-only hidden-md-only">Uplaod:</label>
-                        </v-flex>
-                        <v-flex xs8 class="ml-3">
+                      <img
+                        :src="editedItem.profilePicUrl"
+                        v-else-if="editedItem.profilePicUrl && !imageUrl"
+                      />
+                      <img
+                        v-if="imageUrl"
+                        :src="imageUrl"
+                        height="150"
+                        style="border-radius:50%; width:200px"
+                      />
+                    </v-avatar>
+                    <input
+                      type="file"
+                      style="display:none"
+                      ref="image"
+                      accept="image/*"
+                      @change="onFilePicked"
+                    />
+                  </v-flex>
+                </v-layout>
+                <v-layout wrap>
+                  <v-flex xs12 sm6>
+                    <v-layout>
+                      <v-flex xs4 class="pt-4 subheading">
+                        <label class="right">Name:</label>
+                      </v-flex>
+                      <v-flex xs8 class="ml-3">
+                        <v-text-field
+                          v-model="editedItem.name"
+                          placeholder="fill your Name"
+                          name="name"
+                          type="text"
+                          required
+                        ></v-text-field>
+                      </v-flex>
+                    </v-layout>
+                  </v-flex>
+                  <v-flex xs12 sm6>
+                    <v-layout>
+                      <v-flex xs4 class="pt-4 subheading">
+                        <label class="right">Email ID:</label>
+                      </v-flex>
+                      <v-flex xs8 class="ml-3">
+                        <v-text-field
+                          placeholder="fill your email"
+                          v-model="editedItem.email"
+                          type="text"
+                          name="email"
+                          required
+                        ></v-text-field>
+                      </v-flex>
+                    </v-layout>
+                  </v-flex>
+                </v-layout>
+                <v-layout wrap>
+                  <v-flex xs12 sm6>
+                    <v-layout>
+                      <v-flex xs4 class="pt-4 subheading">
+                        <label class="right hidden-sm-only hidden-xs-only">Date of Birth:</label>
+                        <label class="right hidden-lg-only hidden-xl-only hidden-md-only">D.O.B:</label>
+                      </v-flex>
+                      <v-flex xs8 class="ml-3">
+                        <v-menu
+                          ref="menu"
+                          :close-on-content-click="false"
+                          v-model="menu2"
+                          :nudge-right="40"
+                          lazy
+                          transition="scale-transition"
+                          offset-y
+                          full-width
+                          min-width="290px"
+                        >
                           <v-text-field
-                            label="Select Image"
-                            @click="pickFile"
-                            v-model="imageName"
-                            append-icon="attach_file"
+                            slot="activator"
+                            v-model="editedItem.dob"
+                            placeholder="Select date"
                           ></v-text-field>
-                        </v-flex>
-                      </v-layout>
-                    </v-flex>
-                    <v-flex xs12 sm6>
-                      <v-layout>
-                        <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Address:</label>
-                        </v-flex>
-                        <v-flex xs8 class="ml-3">
+                          <v-date-picker
+                            ref="picker"
+                            v-model="editedItem.dob"
+                            :max="new Date().toISOString().substr(0, 10)"
+                            min="1950-01-01"
+                            @input="menu2 = false"
+                          ></v-date-picker>
+                        </v-menu>
+                      </v-flex>
+                    </v-layout>
+                  </v-flex>
+                  <v-flex xs12 sm6>
+                    <v-layout>
+                      <v-flex xs4 class="pt-4 subheading">
+                        <label class="right">Gender:</label>
+                      </v-flex>
+                      <v-flex xs8 class="ml-3">
+                        <v-select
+                          :items="gender"
+                          v-model="editedItem.gender"
+                          label="Select gender"
+                          name="gender"
+                          required
+                        ></v-select>
+                      </v-flex>
+                    </v-layout>
+                  </v-flex>
+                </v-layout>
+                <v-layout wrap>
+                  <v-flex xs12 sm6>
+                    <v-layout>
+                      <v-flex xs4 class="pt-4 subheading">
+                        <label class="right">Religion:</label>
+                      </v-flex>
+                      <v-flex xs8 class="ml-3">
+                        <v-text-field
+                          v-model="editedItem.religion"
+                          placeholder="fill your Religion"
+                          name="religion"
+                          type="text"
+                          required
+                        ></v-text-field>
+                      </v-flex>
+                    </v-layout>
+                  </v-flex>
+                  <v-flex xs12 sm6>
+                    <v-layout>
+                      <v-flex xs4 class="pt-4 subheading">
+                        <label class="right">JoiningDate:</label>
+                      </v-flex>
+                      <v-flex xs8 class="ml-3">
+                        <v-menu
+                          ref="menu"
+                          :close-on-content-click="false"
+                          v-model="menu3"
+                          :nudge-right="40"
+                          lazy
+                          transition="scale-transition"
+                          offset-y
+                          full-width
+                          min-width="290px"
+                        >
                           <v-text-field
-                            name="input-4-3"
-                            v-model="editedItem.address"
-                            placeholder="fill Your  Address"
-                            required
+                            slot="activator"
+                            v-model="editedItem.joiningDate"
+                            placeholder="Select date"
                           ></v-text-field>
-                        </v-flex>
-                      </v-layout>
-                    </v-flex>
-                  </v-layout>
-                  <v-layout>
-                    <v-flex xs12 sm12>
-                      <v-card-actions>
-                        <v-btn round dark @click.native="close">Cancel</v-btn>
-                        <v-spacer></v-spacer>
-                        <v-btn round dark :loading="loading" @click="save">Save</v-btn>
-                      </v-card-actions>
-                    </v-flex>
-                  </v-layout>
-                </v-container>
-              </v-form>
+                          <v-date-picker
+                            ref="picker"
+                            v-model="editedItem.joiningDate"
+                            :max="new Date().toISOString().substr(0, 10)"
+                            min="1950-01-01"
+                            @input="menu3 = false"
+                          ></v-date-picker>
+                        </v-menu>
+                      </v-flex>
+                    </v-layout>
+                  </v-flex>
+                </v-layout>
+                <v-layout wrap>
+                  <v-flex xs12 sm6>
+                    <v-layout>
+                      <v-flex xs4 class="pt-4 subheading">
+                        <label class="right">Phone:</label>
+                      </v-flex>
+                      <v-flex xs8 class="ml-3">
+                        <v-text-field
+                          v-model="editedItem.phone"
+                          placeholder="fill your MobileNo"
+                          name="mobileNo"
+                          type="number"
+                          required
+                        ></v-text-field>
+                      </v-flex>
+                    </v-layout>
+                  </v-flex>
+                  <v-flex xs12 sm6>
+                    <v-layout>
+                      <v-flex xs4 class="pt-4 subheading">
+                        <label class="right hidden-sm-only hidden-xs-only">Select Role:</label>
+                        <label class="right hidden-lg-only hidden-xl-only hidden-md-only">Role:</label>
+                      </v-flex>
+                      <v-flex xs8 class="ml-3">
+                        <v-autocomplete
+                          v-model="editedItem.role"
+                          :label="editedItem.role"
+                          :items="userRole"
+                          item-text="name"
+                          item-value="role"
+                          required
+                        ></v-autocomplete>
+                      </v-flex>
+                    </v-layout>
+                  </v-flex>
+                </v-layout>
+                <v-layout wrap>
+                  <v-flex xs12 sm6>
+                    <v-layout>
+                      <v-flex xs4 class="pt-4 subheading">
+                        <label class="right hidden-sm-only hidden-xs-only">Uplaod Image:</label>
+                        <label class="right hidden-lg-only hidden-xl-only hidden-md-only">Uplaod:</label>
+                      </v-flex>
+                      <v-flex xs8 class="ml-3">
+                        <v-text-field
+                          label="Select Image"
+                          @click="pickFile"
+                          v-model="imageName"
+                          append-icon="attach_file"
+                        ></v-text-field>
+                      </v-flex>
+                    </v-layout>
+                  </v-flex>
+                  <v-flex xs12 sm6>
+                    <v-layout>
+                      <v-flex xs4 class="pt-4 subheading">
+                        <label class="right">Address:</label>
+                      </v-flex>
+                      <v-flex xs8 class="ml-3">
+                        <v-text-field
+                          name="input-4-3"
+                          v-model="editedItem.address"
+                          placeholder="fill Your  Address"
+                          required
+                        ></v-text-field>
+                      </v-flex>
+                    </v-layout>
+                  </v-flex>
+                </v-layout>
+                <v-layout>
+                  <v-flex xs12 sm12>
+                    <v-card-actions>
+                      <v-btn round dark @click.native="close">Cancel</v-btn>
+                      <v-spacer></v-spacer>
+                      <v-btn round dark :loading="loading" @click="save">Save</v-btn>
+                    </v-card-actions>
+                  </v-flex>
+                </v-layout>
             </v-card-text>
           </v-card>
         </v-dialog>
@@ -372,7 +368,7 @@
                     <v-layout>
                       <v-flex xs4 sm6>
                         <h5 class="right my-1">
-                          <b>Joining Date:</b>
+                          <b>JoiningDate:</b>
                         </h5>
                       </v-flex>
                       <v-flex sm6 xs8>
@@ -613,7 +609,7 @@
                     <v-flex xs12 sm6>
                       <v-layout>
                         <v-flex xs4 class="pt-4 subheading">
-                          <label class="right">Joining Date:</label>
+                          <label class="right">JoiningDate:</label>
                         </v-flex>
                         <v-flex xs8 class="ml-3">
                           <v-menu
diff --git a/src/pages/socialMedia/socialMedia.vue b/src/pages/socialMedia/socialMedia.vue
index 84af1d4..8a51119 100644
--- a/src/pages/socialMedia/socialMedia.vue
+++ b/src/pages/socialMedia/socialMedia.vue
@@ -40,29 +40,6 @@
             <v-card flat>
               <v-form ref="form">
                 <v-container fluid>
-                  <v-layout>
-                    <v-flex
-                      xs12
-                      class="text-xs-center text-sm-center text-md-center text-lg-center mr-4"
-                    >
-                      <v-avatar size="100px">
-                        <img src="/static/icon/user.png" v-if="!imageUrl" />
-                      </v-avatar>
-                      <!-- <input
-                        type="file"
-                        style="display: none"
-                        ref="image"
-                        accept="image/*"
-                        @change="onFilePicked"
-                      />-->
-                      <img
-                        :src="imageData.imageUrl"
-                        height="150"
-                        v-if="imageUrl"
-                        style="border-radius:50%; width:200px"
-                      />
-                    </v-flex>
-                  </v-layout>
                   <v-flex xs12 sm12>
                     <v-layout>
                       <v-flex xs4 class="pt-4 subheading">
@@ -113,46 +90,35 @@
         <!-- ****** PROFILE VIEW REMINDER DEATILS ******  -->
 
         <v-dialog v-model="dialog1" max-width="600px">
-          <v-toolbar color="white">
-            <v-spacer></v-spacer>
-            <v-toolbar-title>
-              <h3>Social Media</h3>
-            </v-toolbar-title>
-            <v-spacer></v-spacer>
-            <v-icon @click="close1">close</v-icon>
-          </v-toolbar>
           <v-card>
-            <v-flex align-center justify-center layout text-xs-center>
-              <v-avatar size="50px" style="position:absolute; top:20px;">
-                <img src="/static/icon/user.png" />
-              </v-avatar>
-            </v-flex>
+            <v-toolbar color="grey lighten-2" flat>
+              <v-spacer></v-spacer>
+              <v-toolbar-title>
+                <h3>Social Media</h3>
+              </v-toolbar-title>
+              <v-spacer></v-spacer>
+              <v-icon @click="close1">close</v-icon>
+            </v-toolbar>
             <v-card-text>
               <v-container grid-list-md>
-                <v-layout wrap>
-                  <v-flex>
-                    <br />
-                    <br />
-                    <v-layout>
-                      <v-flex xs5 sm6>
-                        <h5 class="right my-1">
-                          <b>Title:</b>
-                        </h5>
-                      </v-flex>
-                      <v-flex sm6 xs8>
-                        <h5 class="my-1">{{ editedItem.type }}</h5>
-                      </v-flex>
-                    </v-layout>
-                    <v-layout>
-                      <v-flex xs5 sm6>
-                        <h5 class="right my-1">
-                          <b>Description:</b>
-                        </h5>
-                      </v-flex>
-                      <v-flex sm6 xs8>
-                        <h5 class="my-1">{{ editedItem.linkUrl }}</h5>
-                      </v-flex>
-                    </v-layout>
+                <v-layout>
+                  <v-flex xs4 sm6>
+                    <h5 class="right my-1">
+                      <b>Title:</b>
+                    </h5>
+                  </v-flex>
+                  <v-flex sm6 xs8>
+                    <h5 class="my-1">{{ editedItem.type }}</h5>
+                  </v-flex>
+                </v-layout>
+                <v-layout>
+                  <v-flex xs5 sm6>
+                    <h5 class="right my-1">
+                      <b>Description:</b>
+                    </h5>
+                  </v-flex>
+                  <v-flex sm6 xs8>
+                    <h5 class="my-1 linkCover">{{ editedItem.linkUrl }}</h5>
                   </v-flex>
                 </v-layout>
               </v-container>
@@ -179,7 +145,7 @@
           <template slot="items" slot-scope="props">
             <td id="tabeleData" class="text-xs-center">{{ props.index + 1}}</td>
             <td id="tabeleData" class="text-xs-center">{{ props.item.type}}</td>
-            <td id="tabeleData" class="text-xs-center">{{ props.item.linkUrl}}</td>
+            <td id="tabeleData" class="text-xs-center linkCover">{{ props.item.linkUrl}}</td>
 
             <td id="tabeleData" class="text-xs-center">
               <span>
@@ -225,33 +191,10 @@
             v-model="snackbar"
             color="success"
           >{{ text }}</v-snackbar>
-          <v-flex xs12 sm12 class="my-4">
+          <v-flex xs12 sm8 class="top" offset-sm2>
             <v-card flat>
               <v-form ref="form" v-model="valid" lazy-validation>
                 <v-container fluid>
-                  <v-layout>
-                    <v-flex
-                      xs12
-                      class="text-xs-center text-sm-center text-md-center text-lg-center my-4 mr-4"
-                    >
-                      <v-avatar size="100px">
-                        <img src="/static/icon/user.png" v-if="!imageUrl" />
-                      </v-avatar>
-                      <!-- <input
-                        type="file"
-                        style="display: none"
-                        ref="image"
-                        accept="image/*"
-                        @change="onFilePicked"
-                      />-->
-                      <img
-                        :src="imageData.imageUrl"
-                        height="150"
-                        v-if="imageUrl"
-                        style="border-radius:50%; width:200px"
-                      />
-                    </v-flex>
-                  </v-layout>
                   <v-flex xs12>
                     <v-layout>
                       <v-flex xs4 class="pt-4 subheading">
@@ -288,12 +231,15 @@
                     </v-layout>
                   </v-flex>
                   <v-layout>
-                    <v-flex xs12 sm6 offset-sm3>
-                      <v-card-actions>
-                        <v-btn @click="clear" round dark>clear</v-btn>
-                        <v-spacer></v-spacer>
-                        <v-btn @click="submit" round dark :loading="loading">Add</v-btn>
-                      </v-card-actions>
+                    <v-flex xs12 sm9 offset-sm2>
+                      <v-layout>
+                        <v-flex xs6>
+                          <v-btn @click="clear" round class="ml-3" dark>clear</v-btn>
+                        </v-flex>
+                        <v-flex xs6>
+                          <v-btn @click="submit" round dark :loading="loading" class="right">Add</v-btn>
+                        </v-flex>
+                      </v-layout>
                     </v-flex>
                   </v-layout>
                 </v-container>
diff --git a/static/css/custom.css b/static/css/custom.css
index 18dd9e9..d02c399 100644
--- a/static/css/custom.css
+++ b/static/css/custom.css
@@ -73,6 +73,10 @@
     border-radius: 4px;
 }
 
+.linkCover {
+    overflow: auto !important;
+}
+
 .primary {
     background-color: #aaa !important;
     border-color: #aaa !important;
@@ -254,4 +258,12 @@ h4 {
         width: 80px !important;
         margin-top: 0px !important;
     }
+    .img {
+        height: 200px;
+        width: auto;
+    }
+    .imgNews {
+        height: auto;
+        width: 100px !important;
+    }
 }
\ No newline at end of file
-- 
2.0.0