diff --git a/src/components/questions/diet.vue b/src/components/questions/diet.vue
index 4e23f40..83ea3a8 100644
--- a/src/components/questions/diet.vue
+++ b/src/components/questions/diet.vue
@@ -1,10 +1,8 @@
 <template>
-<v-container grid-list-xl>
-    <v-flex>
-  <v-card>
+  <v-flex>
+    <v-card>
       <v-spacer></v-spacer>
       <v-dialog v-model="dialog" max-width="800px">
-    
         <v-card>
           <v-card-title>
             <span class="headline">{{ formTitle }}</span>
@@ -14,188 +12,210 @@
           <v-flex>
             <v-card>
               <v-card-text>
-          <span>
-          <p><b>Ana Suggestion:</b> Select Suggestion</p></span>
-          <h5>Select Category:</h5>
-          <span>
-            <v-btn color="grey darken-2" flat>Suggestion</v-btn>
-            <v-btn color="grey darken-2" flat>Sex</v-btn>
-            <v-btn color="grey darken-2" flat>Health</v-btn>
-            <v-btn color="grey darken-2" flat>Skin & Beauty</v-btn>
-            <v-btn color="grey darken-2" flat>Diet & Ex</v-btn>
-            </span>
+                <span>
+                  <p>
+                    <b>Ana Suggestion:</b> Select Suggestion
+                  </p>
+                </span>
+                <h5>Select Category:</h5>
+                <span>
+                  <v-btn color="grey darken-2" flat>Suggestion</v-btn>
+                  <v-btn color="grey darken-2" flat>Sex</v-btn>
+                  <v-btn color="grey darken-2" flat>Health</v-btn>
+                  <v-btn color="grey darken-2" flat>Skin & Beauty</v-btn>
+                  <v-btn color="grey darken-2" flat>Diet & Ex</v-btn>
+                </span>
               </v-card-text>
-          </v-card>
+            </v-card>
           </v-flex>
           <v-card-text>
-             
-          <v-container grid-list-md>
-            <v-layout wrap>
-            <v-flex xs12 sm6 md12>    
-          <v-textarea
-           solo
-           v-model="AddQuestioncredentials.question"
-          name="input-7-4"
-          label="Type Question"
-        ></v-textarea>
-              </v-flex>
+            <v-container grid-list-md>
+              <v-layout wrap>
+                <v-flex xs12 sm6 md12>
+                  <v-textarea
+                    solo
+                    v-model="AddQuestioncredentials.question"
+                    name="input-7-4"
+                    label="Type Question"
+                  ></v-textarea>
+                </v-flex>
               </v-layout>
             </v-container>
           </v-card-text>
-
           <v-card-actions>
-          <v-spacer></v-spacer>
-          <v-btn dark large @click.native="save">Post Question</v-btn>
+            <v-spacer></v-spacer>
+            <v-btn dark large @click.native="save">Post Question</v-btn>
           </v-card-actions>
-          </v-card>
-          </v-dialog>
+        </v-card>
+      </v-dialog>
 
-        
-        
-        <v-dialog v-model="dialog1" max-width="800px">
+      <v-dialog v-model="dialog1" max-width="800px">
         <v-card>
-        <v-card-title>
-        <span class="headline">Edit Question</span>
-        <v-spacer></v-spacer>
-        <v-icon @click="close1">close</v-icon>
-        </v-card-title>
+          <v-card-title>
+            <span class="headline">Edit Question</span>
+            <v-spacer></v-spacer>
+            <v-icon @click="close1">close</v-icon>
+          </v-card-title>
 
-        <v-card-text>
-          <v-layout wrap>
+          <v-card-text>
+            <v-layout wrap>
               <v-flex xs12 sm6 md12>
                 <v-text-field outline v-model="editedItem.ques" label="Question"></v-text-field>
               </v-flex>
             </v-layout>
-            <span><p> <b>Ana suggestion:</b> Abnormal Uterine Bleeding <br>
-            Diagnosis 1,Diagnosis 2,Diagnosis 3
-            <v-btn dark large @click.native="save1" style="position:absolute; top:163px; right:5px;">Save Edit</v-btn></p></span>
+            <span>
+              <p>
+                <b>Ana suggestion:</b> Abnormal Uterine Bleeding
+                <br>Diagnosis 1,Diagnosis 2,Diagnosis 3
+                <v-btn
+                  dark
+                  large
+                  @click.native="save1"
+                  style="position:absolute; top:163px; right:5px;"
+                >Save Edit</v-btn>
+              </p>
+            </span>
           </v-card-text>
-         </v-card>
-       </v-dialog>
-    <v-data-table
-      :headers="headers"
-      :items="desserts"
-      class="elevation-1"
-      :pagination.sync="pagination"
-    >
-    <template slot="items" slot-scope="props">
-      <tr v-if="props.index === 0">
-        <td id="td">&nbsp;</td>
-        <td>
-        <span style="cursor:pointer" @click="dialog=true"> <v-icon>add</v-icon>Add New Question</span>
-        </td>
-        <td id="td">&nbsp;</td>
-          <td id="td">&nbsp;</td>
-      </tr>
-      <tr>
-        <td id="td" class="text-xs-center">{{ props.item.no }}</td>
-        <td id="td">{{ props.item.ques }}</td>
-        <td id="td" class="text-xs-center">{{ props.item.res }}</td>
-        <td class="text-xs-center">
-          <span>
-          <img style="cursor:pointer; height:18px; " class="mr-5" @click="editItem(props.item)" src="/static/icon/edit1.png"/>
-          <img style="cursor:pointer; height:20px; " class="mr-5" @click="deleteItem(props.item)" src="/static/icon/delete1.png"/>
-          </span>
-        </td>
-      </tr>
-      </template>
-    </v-data-table>
-  </v-card>
+        </v-card>
+      </v-dialog>
+      <v-data-table
+        :headers="headers"
+        :items="desserts"
+        class="elevation-1"
+        :pagination.sync="pagination"
+      >
+        <template slot="items" slot-scope="props">
+          <tr v-if="props.index === 0">
+            <td id="td">&nbsp;</td>
+            <td>
+              <span style="cursor:pointer" @click="dialog=true">
+                <v-icon>add</v-icon>Add New Question
+              </span>
+            </td>
+            <td id="td">&nbsp;</td>
+            <td id="td">&nbsp;</td>
+          </tr>
+          <tr>
+            <td id="td" class="text-xs-center">{{ props.item.no }}</td>
+            <td id="td">{{ props.item.ques }}</td>
+            <td id="td" class="text-xs-center">{{ props.item.res }}</td>
+            <td class="text-xs-center">
+              <span>
+                <img
+                  style="cursor:pointer; height:18px; "
+                  class="mr-5"
+                  @click="editItem(props.item)"
+                  src="/static/icon/edit1.png"
+                >
+                <img
+                  style="cursor:pointer; height:20px; "
+                  class="mr-5"
+                  @click="deleteItem(props.item)"
+                  src="/static/icon/delete1.png"
+                >
+              </span>
+            </td>
+          </tr>
+        </template>
+      </v-data-table>
+    </v-card>
   </v-flex>
-
-  </v-container>
 </template>
 <script>
 export default {
   data: () => ({
-    question: '',
+    question: "",
     AddQuestioncredentials: {},
     dialog: false,
     dialog1: false,
     isActive: true,
     newActive: false,
     pagination: {
-      rowsPerPage: 10,
+      rowsPerPage: 10
     },
     headers: [
       {
-        text: 'No.',
-        align: 'center',
+        text: "No.",
+        align: "center",
+        sortable: false,
+        value: "name"
+      },
+      { text: "Posts", value: "posts", sortable: false, align: "center" },
+      {
+        text: "Responses",
+        value: "responses",
         sortable: false,
-        value: 'name'
+        align: "center"
       },
-      { text: 'Posts', value: 'posts', sortable: false, align: 'center' },
-      { text: 'Responses', value: 'responses', sortable: false, align: 'center' },
-      { text: '', value: 'carbs', sortable: false, align: 'center' },
+      { text: "", value: "carbs", sortable: false, align: "center" }
     ],
     desserts: [],
     editedIndex: -1,
     editedItem: {
-      question: '',
-      
+      question: ""
     },
     defaultItem: {
       no: 0,
-      question: '',
-      res: 0,
-      
+      question: "",
+      res: 0
     }
   }),
 
   computed: {
-    formTitle () {
-      return this.editedIndex === -1 ? 'Create New Question' : 'Edit Question';
+    formTitle() {
+      return this.editedIndex === -1 ? "Create New Question" : "Edit Question";
     }
   },
 
   watch: {
-    dialog (val) {
+    dialog(val) {
       val || this.close();
     }
   },
 
-  created () {
+  created() {
     this.initialize();
   },
 
   methods: {
-    initialize () {
+    initialize() {
       this.desserts = [
         {
-          no: '1',
-          ques: 'questions diet',
-          res: 12,
-        },
+          no: "1",
+          ques: "questions diet",
+          res: 12
+        }
       ];
-    },    
+    },
 
-    editItem (item) {
+    editItem(item) {
       this.editedIndex = this.desserts.indexOf(item);
       this.editedItem = Object.assign({}, item);
       this.dialog1 = true;
     },
 
-    deleteItem (item) {
+    deleteItem(item) {
       const index = this.desserts.indexOf(item);
-      confirm('Are you sure you want to delete this item?') && this.desserts.splice(index, 1);
+      confirm("Are you sure you want to delete this item?") &&
+        this.desserts.splice(index, 1);
     },
 
-    close () {
+    close() {
       this.dialog = false;
       setTimeout(() => {
         this.editedItem = Object.assign({}, this.defaultItem);
         this.editedIndex = -1;
       }, 300);
     },
-    close1 () {
+    close1() {
       this.dialog1 = false;
       setTimeout(() => {
         this.editedItem = Object.assign({}, this.defaultItem);
         this.editedIndex = -1;
       }, 300);
     },
-    save () {
-      console.log('editedItem', this.editedItem);
+    save() {
+      console.log("editedItem", this.editedItem);
       if (this.editedIndex > -1) {
         Object.assign(this.desserts[this.editedIndex], this.editedItem);
       } else {
@@ -203,8 +223,8 @@ export default {
       }
       this.close();
     },
-    save1 () {
-      console.log('editedItem', this.editedItem);
+    save1() {
+      console.log("editedItem", this.editedItem);
       if (this.editedIndex > -1) {
         Object.assign(this.desserts[this.editedIndex], this.editedItem);
       } else {
@@ -212,17 +232,16 @@ export default {
       }
       this.close1();
     }
-  },
+  }
   // switchComponent (comp) {
   //   this.$emit('switchComp', comp);
   // }
 };
 </script>
 <style>
-#td{
-    border: 1px solid #dddddd;
-    text-align: left;
-    padding: 8px;
-   
+#td {
+  border: 1px solid #dddddd;
+  text-align: left;
+  padding: 8px;
 }
 </style>
diff --git a/src/components/questions/health.vue b/src/components/questions/health.vue
index 02dd06a..f79e848 100644
--- a/src/components/questions/health.vue
+++ b/src/components/questions/health.vue
@@ -1,10 +1,8 @@
 <template>
-<v-container grid-list-xl>
-    <v-flex>
-  <v-card>
+  <v-flex>
+    <v-card>
       <v-spacer></v-spacer>
       <v-dialog v-model="dialog" max-width="800px">
-    
         <v-card>
           <v-card-title>
             <span class="headline">{{ formTitle }}</span>
@@ -14,188 +12,210 @@
           <v-flex>
             <v-card>
               <v-card-text>
-          <span>
-          <p><b>Ana Suggestion:</b> Select Suggestion</p></span>
-          <h5>Select Category:</h5>
-          <span>
-            <v-btn color="grey darken-2" flat>Suggestion</v-btn>
-            <v-btn color="grey darken-2" flat>Sex</v-btn>
-            <v-btn color="grey darken-2" flat>Health</v-btn>
-            <v-btn color="grey darken-2" flat>Skin & Beauty</v-btn>
-            <v-btn color="grey darken-2" flat>Diet & Ex</v-btn>
-            </span>
+                <span>
+                  <p>
+                    <b>Ana Suggestion:</b> Select Suggestion
+                  </p>
+                </span>
+                <h5>Select Category:</h5>
+                <span>
+                  <v-btn color="grey darken-2" flat>Suggestion</v-btn>
+                  <v-btn color="grey darken-2" flat>Sex</v-btn>
+                  <v-btn color="grey darken-2" flat>Health</v-btn>
+                  <v-btn color="grey darken-2" flat>Skin & Beauty</v-btn>
+                  <v-btn color="grey darken-2" flat>Diet & Ex</v-btn>
+                </span>
               </v-card-text>
-          </v-card>
+            </v-card>
           </v-flex>
           <v-card-text>
-             
-          <v-container grid-list-md>
-            <v-layout wrap>
-            <v-flex xs12 sm6 md12>    
-          <v-textarea
-           solo
-           v-model="AddQuestioncredentials.question"
-          name="input-7-4"
-          label="Type Question"
-        ></v-textarea>
-              </v-flex>
+            <v-container grid-list-md>
+              <v-layout wrap>
+                <v-flex xs12 sm6 md12>
+                  <v-textarea
+                    solo
+                    v-model="AddQuestioncredentials.question"
+                    name="input-7-4"
+                    label="Type Question"
+                  ></v-textarea>
+                </v-flex>
               </v-layout>
             </v-container>
           </v-card-text>
-
           <v-card-actions>
-          <v-spacer></v-spacer>
-          <v-btn dark large @click.native="save">Post Question</v-btn>
+            <v-spacer></v-spacer>
+            <v-btn dark large @click.native="save">Post Question</v-btn>
           </v-card-actions>
-          </v-card>
-          </v-dialog>
+        </v-card>
+      </v-dialog>
 
-        
-        
-        <v-dialog v-model="dialog1" max-width="800px">
+      <v-dialog v-model="dialog1" max-width="800px">
         <v-card>
-        <v-card-title>
-        <span class="headline">Edit Question</span>
-        <v-spacer></v-spacer>
-        <v-icon @click="close1">close</v-icon>
-        </v-card-title>
+          <v-card-title>
+            <span class="headline">Edit Question</span>
+            <v-spacer></v-spacer>
+            <v-icon @click="close1">close</v-icon>
+          </v-card-title>
 
-        <v-card-text>
-          <v-layout wrap>
+          <v-card-text>
+            <v-layout wrap>
               <v-flex xs12 sm6 md12>
                 <v-text-field outline v-model="editedItem.ques" label="Question"></v-text-field>
               </v-flex>
             </v-layout>
-            <span><p> <b>Ana suggestion:</b> Abnormal Uterine Bleeding <br>
-            Diagnosis 1,Diagnosis 2,Diagnosis 3
-            <v-btn dark large @click.native="save1" style="position:absolute; top:163px; right:5px;">Save Edit</v-btn></p></span>
+            <span>
+              <p>
+                <b>Ana suggestion:</b> Abnormal Uterine Bleeding
+                <br>Diagnosis 1,Diagnosis 2,Diagnosis 3
+                <v-btn
+                  dark
+                  large
+                  @click.native="save1"
+                  style="position:absolute; top:163px; right:5px;"
+                >Save Edit</v-btn>
+              </p>
+            </span>
           </v-card-text>
-         </v-card>
-       </v-dialog>
-    <v-data-table
-      :headers="headers"
-      :items="desserts"
-      class="elevation-1"
-      :pagination.sync="pagination"
-    >
-    <template slot="items" slot-scope="props">
-      <tr v-if="props.index === 0">
-        <td id="td">&nbsp;</td>
-        <td>
-        <span style="cursor:pointer" @click="dialog=true"> <v-icon>add</v-icon>Add New Question</span>
-        </td>
-        <td id="td">&nbsp;</td>
-          <td id="td">&nbsp;</td>
-      </tr>
-      <tr>
-        <td id="td" class="text-xs-center">{{ props.item.no }}</td>
-        <td id="td">{{ props.item.ques }}</td>
-        <td id="td" class="text-xs-center">{{ props.item.res }}</td>
-        <td class="text-xs-center">
-          <span>
-          <img style="cursor:pointer; height:18px; " class="mr-5" @click="editItem(props.item)" src="/static/icon/edit1.png"/>
-          <img style="cursor:pointer; height:20px; " class="mr-5" @click="deleteItem(props.item)" src="/static/icon/delete1.png"/>
-          </span>
-        </td>
-      </tr>
-      </template>
-    </v-data-table>
-  </v-card>
+        </v-card>
+      </v-dialog>
+      <v-data-table
+        :headers="headers"
+        :items="desserts"
+        class="elevation-1"
+        :pagination.sync="pagination"
+      >
+        <template slot="items" slot-scope="props">
+          <tr v-if="props.index === 0">
+            <td id="td">&nbsp;</td>
+            <td>
+              <span style="cursor:pointer" @click="dialog=true">
+                <v-icon>add</v-icon>Add New Question
+              </span>
+            </td>
+            <td id="td">&nbsp;</td>
+            <td id="td">&nbsp;</td>
+          </tr>
+          <tr>
+            <td id="td" class="text-xs-center">{{ props.item.no }}</td>
+            <td id="td">{{ props.item.ques }}</td>
+            <td id="td" class="text-xs-center">{{ props.item.res }}</td>
+            <td class="text-xs-center">
+              <span>
+                <img
+                  style="cursor:pointer; height:18px; "
+                  class="mr-5"
+                  @click="editItem(props.item)"
+                  src="/static/icon/edit1.png"
+                >
+                <img
+                  style="cursor:pointer; height:20px; "
+                  class="mr-5"
+                  @click="deleteItem(props.item)"
+                  src="/static/icon/delete1.png"
+                >
+              </span>
+            </td>
+          </tr>
+        </template>
+      </v-data-table>
+    </v-card>
   </v-flex>
-
-  </v-container>
 </template>
 <script>
 export default {
   data: () => ({
-    question: '',
+    question: "",
     AddQuestioncredentials: {},
     dialog: false,
     dialog1: false,
     isActive: true,
     newActive: false,
     pagination: {
-      rowsPerPage: 10,
+      rowsPerPage: 10
     },
     headers: [
       {
-        text: 'No.',
-        align: 'center',
+        text: "No.",
+        align: "center",
+        sortable: false,
+        value: "name"
+      },
+      { text: "Posts", value: "posts", sortable: false, align: "center" },
+      {
+        text: "Responses",
+        value: "responses",
         sortable: false,
-        value: 'name'
+        align: "center"
       },
-      { text: 'Posts', value: 'posts', sortable: false, align: 'center' },
-      { text: 'Responses', value: 'responses', sortable: false, align: 'center' },
-      { text: '', value: 'carbs', sortable: false, align: 'center' },
+      { text: "", value: "carbs", sortable: false, align: "center" }
     ],
     desserts: [],
     editedIndex: -1,
     editedItem: {
-      question: '',
-      
+      question: ""
     },
     defaultItem: {
       no: 0,
-      question: '',
-      res: 0,
-      
+      question: "",
+      res: 0
     }
   }),
 
   computed: {
-    formTitle () {
-      return this.editedIndex === -1 ? 'Create New Question' : 'Edit Question';
+    formTitle() {
+      return this.editedIndex === -1 ? "Create New Question" : "Edit Question";
     }
   },
 
   watch: {
-    dialog (val) {
+    dialog(val) {
       val || this.close();
     }
   },
 
-  created () {
+  created() {
     this.initialize();
   },
 
   methods: {
-    initialize () {
+    initialize() {
       this.desserts = [
         {
-          no: '1',
-          ques: 'questions health',
-          res: 11,
-        },
+          no: "1",
+          ques: "questions health",
+          res: 11
+        }
       ];
-    },    
+    },
 
-    editItem (item) {
+    editItem(item) {
       this.editedIndex = this.desserts.indexOf(item);
       this.editedItem = Object.assign({}, item);
       this.dialog1 = true;
     },
 
-    deleteItem (item) {
+    deleteItem(item) {
       const index = this.desserts.indexOf(item);
-      confirm('Are you sure you want to delete this item?') && this.desserts.splice(index, 1);
+      confirm("Are you sure you want to delete this item?") &&
+        this.desserts.splice(index, 1);
     },
 
-    close () {
+    close() {
       this.dialog = false;
       setTimeout(() => {
         this.editedItem = Object.assign({}, this.defaultItem);
         this.editedIndex = -1;
       }, 300);
     },
-    close1 () {
+    close1() {
       this.dialog1 = false;
       setTimeout(() => {
         this.editedItem = Object.assign({}, this.defaultItem);
         this.editedIndex = -1;
       }, 300);
     },
-    save () {
-      console.log('editedItem', this.editedItem);
+    save() {
+      console.log("editedItem", this.editedItem);
       if (this.editedIndex > -1) {
         Object.assign(this.desserts[this.editedIndex], this.editedItem);
       } else {
@@ -203,8 +223,8 @@ export default {
       }
       this.close();
     },
-    save1 () {
-      console.log('editedItem', this.editedItem);
+    save1() {
+      console.log("editedItem", this.editedItem);
       if (this.editedIndex > -1) {
         Object.assign(this.desserts[this.editedIndex], this.editedItem);
       } else {
@@ -212,17 +232,16 @@ export default {
       }
       this.close1();
     }
-  },
+  }
   // switchComponent (comp) {
   //   this.$emit('switchComp', comp);
   // }
 };
 </script>
 <style>
-#td{
-    border: 1px solid #dddddd;
-    text-align: left;
-    padding: 8px;
-   
+#td {
+  border: 1px solid #dddddd;
+  text-align: left;
+  padding: 8px;
 }
 </style>
diff --git a/src/components/questions/sex.vue b/src/components/questions/sex.vue
index 032db38..0341909 100644
--- a/src/components/questions/sex.vue
+++ b/src/components/questions/sex.vue
@@ -1,10 +1,8 @@
 <template>
-<v-container grid-list-xl>
-    <v-flex>
-  <v-card>
+  <v-flex>
+    <v-card>
       <v-spacer></v-spacer>
       <v-dialog v-model="dialog" max-width="800px">
-    
         <v-card>
           <v-card-title>
             <span class="headline">{{ formTitle }}</span>
@@ -14,188 +12,211 @@
           <v-flex>
             <v-card>
               <v-card-text>
-          <span>
-          <p><b>Ana Suggestion:</b> Select Suggestion</p></span>
-          <h5>Select Category:</h5>
-          <span>
-            <v-btn color="grey darken-2" flat>Suggestion</v-btn>
-            <v-btn color="grey darken-2" flat>Sex</v-btn>
-            <v-btn color="grey darken-2" flat>Health</v-btn>
-            <v-btn color="grey darken-2" flat>Skin & Beauty</v-btn>
-            <v-btn color="grey darken-2" flat>Diet & Ex</v-btn>
-            </span>
+                <span>
+                  <p>
+                    <b>Ana Suggestion:</b> Select Suggestion
+                  </p>
+                </span>
+                <h5>Select Category:</h5>
+                <span>
+                  <v-btn color="grey darken-2" flat>Suggestion</v-btn>
+                  <v-btn color="grey darken-2" flat>Sex</v-btn>
+                  <v-btn color="grey darken-2" flat>Health</v-btn>
+                  <v-btn color="grey darken-2" flat>Skin & Beauty</v-btn>
+                  <v-btn color="grey darken-2" flat>Diet & Ex</v-btn>
+                </span>
               </v-card-text>
-          </v-card>
+            </v-card>
           </v-flex>
           <v-card-text>
-             
-          <v-container grid-list-md>
-            <v-layout wrap>
-            <v-flex xs12 sm6 md12>    
-          <v-textarea
-           solo
-           v-model="AddQuestioncredentials.question"
-          name="input-7-4"
-          label="Type Question"
-        ></v-textarea>
-              </v-flex>
+            <v-container grid-list-md>
+              <v-layout wrap>
+                <v-flex xs12 sm6 md12>
+                  <v-textarea
+                    solo
+                    v-model="AddQuestioncredentials.question"
+                    name="input-7-4"
+                    label="Type Question"
+                  ></v-textarea>
+                </v-flex>
               </v-layout>
             </v-container>
           </v-card-text>
 
           <v-card-actions>
-          <v-spacer></v-spacer>
-          <v-btn dark large @click.native="save">Post Question</v-btn>
+            <v-spacer></v-spacer>
+            <v-btn dark large @click.native="save">Post Question</v-btn>
           </v-card-actions>
-          </v-card>
-          </v-dialog>
+        </v-card>
+      </v-dialog>
 
-        
-        
-        <v-dialog v-model="dialog1" max-width="800px">
+      <v-dialog v-model="dialog1" max-width="800px">
         <v-card>
-        <v-card-title>
-        <span class="headline">Edit Question</span>
-        <v-spacer></v-spacer>
-        <v-icon @click="close1">close</v-icon>
-        </v-card-title>
+          <v-card-title>
+            <span class="headline">Edit Question</span>
+            <v-spacer></v-spacer>
+            <v-icon @click="close1">close</v-icon>
+          </v-card-title>
 
-        <v-card-text>
-          <v-layout wrap>
+          <v-card-text>
+            <v-layout wrap>
               <v-flex xs12 sm6 md12>
                 <v-text-field outline v-model="editedItem.ques" label="Question"></v-text-field>
               </v-flex>
             </v-layout>
-            <span><p> <b>Ana suggestion:</b> Abnormal Uterine Bleeding <br>
-            Diagnosis 1,Diagnosis 2,Diagnosis 3
-            <v-btn dark large @click.native="save1" style="position:absolute; top:163px; right:5px;">Save Edit</v-btn></p></span>
+            <span>
+              <p>
+                <b>Ana suggestion:</b> Abnormal Uterine Bleeding
+                <br>Diagnosis 1,Diagnosis 2,Diagnosis 3
+                <v-btn
+                  dark
+                  large
+                  @click.native="save1"
+                  style="position:absolute; top:163px; right:5px;"
+                >Save Edit</v-btn>
+              </p>
+            </span>
           </v-card-text>
-         </v-card>
-       </v-dialog>
-    <v-data-table
-      :headers="headers"
-      :items="desserts"
-      class="elevation-1"
-      :pagination.sync="pagination"
-    >
-    <template slot="items" slot-scope="props">
-      <tr v-if="props.index === 0">
-        <td id="td">&nbsp;</td>
-        <td>
-        <span style="cursor:pointer" @click="dialog=true"> <v-icon>add</v-icon>Add New Question</span>
-        </td>
-        <td id="td">&nbsp;</td>
-          <td id="td">&nbsp;</td>
-      </tr>
-      <tr>
-        <td id="td" class="text-xs-center">{{ props.item.no }}</td>
-        <td id="td">{{ props.item.ques }}</td>
-        <td id="td" class="text-xs-center">{{ props.item.res }}</td>
-        <td class="text-xs-center">
-          <span>
-          <img style="cursor:pointer; height:18px; " class="mr-5" @click="editItem(props.item)" src="/static/icon/edit1.png"/>
-          <img style="cursor:pointer; height:20px; " class="mr-5" @click="deleteItem(props.item)" src="/static/icon/delete1.png"/>
-          </span>
-        </td>
-      </tr>
-      </template>
-    </v-data-table>
-  </v-card>
+        </v-card>
+      </v-dialog>
+      <v-data-table
+        :headers="headers"
+        :items="desserts"
+        class="elevation-1"
+        :pagination.sync="pagination"
+      >
+        <template slot="items" slot-scope="props">
+          <tr v-if="props.index === 0">
+            <td id="td">&nbsp;</td>
+            <td>
+              <span style="cursor:pointer" @click="dialog=true">
+                <v-icon>add</v-icon>Add New Question
+              </span>
+            </td>
+            <td id="td">&nbsp;</td>
+            <td id="td">&nbsp;</td>
+          </tr>
+          <tr>
+            <td id="td" class="text-xs-center">{{ props.item.no }}</td>
+            <td id="td">{{ props.item.ques }}</td>
+            <td id="td" class="text-xs-center">{{ props.item.res }}</td>
+            <td class="text-xs-center">
+              <span>
+                <img
+                  style="cursor:pointer; height:18px; "
+                  class="mr-5"
+                  @click="editItem(props.item)"
+                  src="/static/icon/edit1.png"
+                >
+                <img
+                  style="cursor:pointer; height:20px; "
+                  class="mr-5"
+                  @click="deleteItem(props.item)"
+                  src="/static/icon/delete1.png"
+                >
+              </span>
+            </td>
+          </tr>
+        </template>
+      </v-data-table>
+    </v-card>
   </v-flex>
-
-  </v-container>
 </template>
 <script>
 export default {
   data: () => ({
-    question: '',
+    question: "",
     AddQuestioncredentials: {},
     dialog: false,
     dialog1: false,
     isActive: true,
     newActive: false,
     pagination: {
-      rowsPerPage: 10,
+      rowsPerPage: 10
     },
     headers: [
       {
-        text: 'No.',
-        align: 'center',
+        text: "No.",
+        align: "center",
+        sortable: false,
+        value: "name"
+      },
+      { text: "Posts", value: "posts", sortable: false, align: "center" },
+      {
+        text: "Responses",
+        value: "responses",
         sortable: false,
-        value: 'name'
+        align: "center"
       },
-      { text: 'Posts', value: 'posts', sortable: false, align: 'center' },
-      { text: 'Responses', value: 'responses', sortable: false, align: 'center' },
-      { text: '', value: 'carbs', sortable: false, align: 'center' },
+      { text: "", value: "carbs", sortable: false, align: "center" }
     ],
     desserts: [],
     editedIndex: -1,
     editedItem: {
-      question: '',
-      
+      question: ""
     },
     defaultItem: {
       no: 0,
-      question: '',
-      res: 0,
-      
+      question: "",
+      res: 0
     }
   }),
 
   computed: {
-    formTitle () {
-      return this.editedIndex === -1 ? 'Create New Question' : 'Edit Question';
+    formTitle() {
+      return this.editedIndex === -1 ? "Create New Question" : "Edit Question";
     }
   },
 
   watch: {
-    dialog (val) {
+    dialog(val) {
       val || this.close();
     }
   },
 
-  created () {
+  created() {
     this.initialize();
   },
 
   methods: {
-    initialize () {
+    initialize() {
       this.desserts = [
         {
-          no: '1',
-          ques: 'questions sex',
-          res: 8,
-        },
+          no: "1",
+          ques: "questions sex",
+          res: 8
+        }
       ];
-    },    
+    },
 
-    editItem (item) {
+    editItem(item) {
       this.editedIndex = this.desserts.indexOf(item);
       this.editedItem = Object.assign({}, item);
       this.dialog1 = true;
     },
 
-    deleteItem (item) {
+    deleteItem(item) {
       const index = this.desserts.indexOf(item);
-      confirm('Are you sure you want to delete this item?') && this.desserts.splice(index, 1);
+      confirm("Are you sure you want to delete this item?") &&
+        this.desserts.splice(index, 1);
     },
 
-    close () {
+    close() {
       this.dialog = false;
       setTimeout(() => {
         this.editedItem = Object.assign({}, this.defaultItem);
         this.editedIndex = -1;
       }, 300);
     },
-    close1 () {
+    close1() {
       this.dialog1 = false;
       setTimeout(() => {
         this.editedItem = Object.assign({}, this.defaultItem);
         this.editedIndex = -1;
       }, 300);
     },
-    save () {
-      console.log('editedItem', this.editedItem);
+    save() {
+      console.log("editedItem", this.editedItem);
       if (this.editedIndex > -1) {
         Object.assign(this.desserts[this.editedIndex], this.editedItem);
       } else {
@@ -203,8 +224,8 @@ export default {
       }
       this.close();
     },
-    save1 () {
-      console.log('editedItem', this.editedItem);
+    save1() {
+      console.log("editedItem", this.editedItem);
       if (this.editedIndex > -1) {
         Object.assign(this.desserts[this.editedIndex], this.editedItem);
       } else {
@@ -212,17 +233,16 @@ export default {
       }
       this.close1();
     }
-  },
+  }
   // switchComponent (comp) {
   //   this.$emit('switchComp', comp);
   // }
 };
 </script>
 <style>
-#td{
-    border: 1px solid #dddddd;
-    text-align: left;
-    padding: 8px;
-   
+#td {
+  border: 1px solid #dddddd;
+  text-align: left;
+  padding: 8px;
 }
 </style>
diff --git a/src/components/questions/skin.vue b/src/components/questions/skin.vue
index 9abbf39..c7d0f96 100644
--- a/src/components/questions/skin.vue
+++ b/src/components/questions/skin.vue
@@ -1,5 +1,4 @@
 <template>
-<v-container grid-list-xl>
     <v-flex>
   <v-card>
       <v-spacer></v-spacer>
@@ -102,8 +101,6 @@
     </v-data-table>
   </v-card>
   </v-flex>
-
-  </v-container>
 </template>
 <script>
 export default {
diff --git a/src/components/questions/suggestion.vue b/src/components/questions/suggestion.vue
index 37b671b..bc6317a 100644
--- a/src/components/questions/suggestion.vue
+++ b/src/components/questions/suggestion.vue
@@ -1,10 +1,8 @@
 <template>
-<v-container grid-list-xl>
-    <v-flex>
-  <v-card>
+  <v-flex>
+    <v-card>
       <v-spacer></v-spacer>
       <v-dialog v-model="dialog" max-width="800px">
-    
         <v-card>
           <v-card-title>
             <span class="headline">{{ formTitle }}</span>
@@ -14,189 +12,242 @@
           <v-flex>
             <v-card>
               <v-card-text>
-          <span>
-          <p><b>Ana Suggestion:</b> Select Suggestion</p></span>
-          <h5>Select Category:</h5>
-          <span>
-            <v-btn color="grey darken-2" flat>Suggestion</v-btn>
-            <v-btn color="grey darken-2" flat>Sex</v-btn>
-            <v-btn color="grey darken-2" flat>Health</v-btn>
-            <v-btn color="grey darken-2" flat>Skin & Beauty</v-btn>
-            <v-btn color="grey darken-2" flat>Diet & Ex</v-btn>
-            </span>
+                <span>
+                  <p>
+                    <b>Ana Suggestion:</b> Select Suggestion
+                  </p>
+                </span>
+                <h5>Select Category:</h5>
+                <span>
+                  <v-btn color="grey darken-2" flat>Suggestion</v-btn>
+                  <v-btn color="grey darken-2" flat>Sex</v-btn>
+                  <v-btn color="grey darken-2" flat>Health</v-btn>
+                  <v-btn color="grey darken-2" flat>Skin & Beauty</v-btn>
+                  <v-btn color="grey darken-2" flat>Diet & Ex</v-btn>
+                </span>
               </v-card-text>
-          </v-card>
+            </v-card>
           </v-flex>
           <v-card-text>
-             
-          <v-container grid-list-md>
-            <v-layout wrap>
-            <v-flex xs12 sm6 md12>    
-          <v-textarea
-           solo
-           v-model="AddQuestioncredentials.question"
-          name="input-7-4"
-          label="Type Question"
-        ></v-textarea>
-              </v-flex>
+            <v-container grid-list-md>
+              <v-layout wrap>
+                <v-flex xs12 sm6 md12>
+                  <v-textarea
+                    solo
+                    v-model="AddQuestioncredentials.question"
+                    name="input-7-4"
+                    label="Type Question"
+                  ></v-textarea>
+                </v-flex>
               </v-layout>
             </v-container>
           </v-card-text>
 
           <v-card-actions>
-          <v-spacer></v-spacer>
-          <v-btn dark large @click.native="save">Post Question</v-btn>
+            <v-spacer></v-spacer>
+            <v-btn dark large @click.native="save">Post Question</v-btn>
           </v-card-actions>
-          </v-card>
-          </v-dialog>
-
-        
-        
-        <v-dialog v-model="dialog1" max-width="800px">
+        </v-card>
+      </v-dialog>
+      <v-dialog v-model="dialog1" max-width="800px">
         <v-card>
-        <v-card-title>
-        <span class="headline">Edit Question</span>
-        <v-spacer></v-spacer>
-        <v-icon @click="close1">close</v-icon>
-        </v-card-title>
+          <v-card-title>
+            <span class="headline">Edit Question</span>
+            <v-spacer></v-spacer>
+            <v-icon @click="close1">close</v-icon>
+          </v-card-title>
 
-        <v-card-text>
-          <v-layout wrap>
+          <v-card-text>
+            <v-layout wrap>
               <v-flex xs12 sm6 md12>
                 <v-text-field outline v-model="editedItem.ques" label="Question"></v-text-field>
               </v-flex>
             </v-layout>
-            <span><p> <b>Ana suggestion:</b> Abnormal Uterine Bleeding <br>
-            Diagnosis 1,Diagnosis 2,Diagnosis 3
-            <v-btn dark large @click.native="save1" style="position:absolute; top:163px; right:5px;">Save Edit</v-btn></p></span>
+            <span>
+              <p>
+                <b>Ana suggestion:</b> Abnormal Uterine Bleeding
+                <br>Diagnosis 1,Diagnosis 2,Diagnosis 3
+                <v-btn
+                  dark
+                  large
+                  @click.native="save1"
+                  style="position:absolute; top:163px; right:5px;"
+                >Save Edit</v-btn>
+              </p>
+            </span>
           </v-card-text>
-         </v-card>
-       </v-dialog>
-       <v-card>
-    <v-data-table
-      :headers="headers"
-      :items="desserts"
-      class="elevation-1"
-      :pagination.sync="pagination"
-    >
-    <template slot="items" slot-scope="props">
-      <tr v-if="props.index === 0">
-        <td id="td">&nbsp;</td>
-        <td>
-        <span style="cursor:pointer" @click="dialog=true"> <v-icon>add</v-icon>Add New Question</span>
-        </td>
-        <td id="td">&nbsp;</td>
-          <td id="td">&nbsp;</td>
-      </tr>
-      <tr>
-        <td id="td" class="text-xs-center">{{ props.item.no }}</td>
-        <td id="td">{{ props.item.ques }}</td>
-        <td id="td" class="text-xs-center">{{ props.item.res }}</td>
-        <td class="text-xs-center">
-          <span>
-          <img style="cursor:pointer; height:18px; " class="mr-5" @click="editItem(props.item)" src="/static/icon/edit1.png"/>
-          <img style="cursor:pointer; height:20px; " class="mr-5" @click="deleteItem(props.item)" src="/static/icon/delete1.png"/>
-          </span>
-        </td>
-      </tr>
-      </template>
-    </v-data-table></v-card>
-  </v-card>
+        </v-card>
+      </v-dialog>
+      <v-card>
+        <v-data-table
+          :headers="headers"
+          :items="desserts"
+          class="elevation-1"
+          :pagination.sync="pagination"
+        >
+          <template slot="items" slot-scope="props">
+            <tr v-if="props.index === 0">
+              <td id="td">&nbsp;</td>
+              <td>
+                <span style="cursor:pointer" @click="dialog=true">
+                  <v-icon>add</v-icon>Add New Question
+                </span>
+              </td>
+              <td id="td">&nbsp;</td>
+              <td id="td">&nbsp;</td>
+            </tr>
+            <tr>
+              <td id="td" class="text-xs-center">{{ props.item.no }}</td>
+              <td id="td">{{ props.item.ques }}</td>
+              <td id="td" class="text-xs-center">{{ props.item.res }}</td>
+              <td class="text-xs-center">
+                <span>
+                  <img
+                    style="cursor:pointer; height:18px; "
+                    class="mr-5"
+                    @click="editItem(props.item)"
+                    src="/static/icon/edit1.png"
+                  >
+                  <img
+                    style="cursor:pointer; height:20px; "
+                    class="mr-5"
+                    @click="deleteItem(props.item)"
+                    src="/static/icon/delete1.png"
+                  >
+                </span>
+              </td>
+            </tr>
+          </template>
+        </v-data-table>
+      </v-card>
+    </v-card>
   </v-flex>
-
-  </v-container>
 </template>
 <script>
 export default {
   data: () => ({
-    question: '',
+    question: "",
     AddQuestioncredentials: {},
     dialog: false,
     dialog1: false,
     isActive: true,
     newActive: false,
     pagination: {
-      rowsPerPage: 10,
+      rowsPerPage: 10
     },
     headers: [
       {
-        text: 'No.',
-        align: 'center',
+        text: "No.",
+        align: "center",
+        sortable: false,
+        value: "name"
+      },
+      { text: "Posts", value: "posts", sortable: false, align: "center" },
+      {
+        text: "Responses",
+        value: "responses",
         sortable: false,
-        value: 'name'
+        align: "center"
       },
-      { text: 'Posts', value: 'posts', sortable: false, align: 'center' },
-      { text: 'Responses', value: 'responses', sortable: false, align: 'center' },
-      { text: '', value: 'carbs', sortable: false, align: 'center' },
+      { text: "", value: "carbs", sortable: false, align: "center" }
     ],
     desserts: [],
     editedIndex: -1,
     editedItem: {
-      question: '',
-      
+      question: ""
     },
     defaultItem: {
       no: 0,
-      question: '',
-      res: 0,
-      
+      question: "",
+      res: 0
     }
   }),
 
   computed: {
-    formTitle () {
-      return this.editedIndex === -1 ? 'Create New Question' : 'Edit Question';
+    formTitle() {
+      return this.editedIndex === -1 ? "Create New Question" : "Edit Question";
     }
   },
 
   watch: {
-    dialog (val) {
+    dialog(val) {
       val || this.close();
     }
   },
 
-  created () {
+  created() {
     this.initialize();
   },
 
   methods: {
-    initialize () {
+    initialize() {
       this.desserts = [
         {
-          no: '1',
-          ques: 'questions suggestion',
-          res: 21,
+          no: "1",
+          ques: "questions suggestion",
+          res: 21
+        },
+        {
+          no: "1",
+          ques: "questions",
+          res: 21
+        },
+        {
+          no: "1",
+          ques: " suggestion",
+          res: 21
+        },
+        {
+          no: "1",
+          ques: "questions",
+          res: 21
         },
+        {
+          no: "1",
+          ques: "questions suggestion",
+          res: 21
+        },
+        {
+          no: "1",
+          ques: "suggestion",
+          res: 21
+        },
+        {
+          no: "1",
+          ques: "questions suggestion",
+          res: 21
+        }
       ];
-    },    
+    },
 
-    editItem (item) {
+    editItem(item) {
       this.editedIndex = this.desserts.indexOf(item);
       this.editedItem = Object.assign({}, item);
       this.dialog1 = true;
     },
 
-    deleteItem (item) {
+    deleteItem(item) {
       const index = this.desserts.indexOf(item);
-      confirm('Are you sure you want to delete this item?') && this.desserts.splice(index, 1);
+      confirm("Are you sure you want to delete this item?") &&
+        this.desserts.splice(index, 1);
     },
 
-    close () {
+    close() {
       this.dialog = false;
       setTimeout(() => {
         this.editedItem = Object.assign({}, this.defaultItem);
         this.editedIndex = -1;
       }, 300);
     },
-    close1 () {
+    close1() {
       this.dialog1 = false;
       setTimeout(() => {
         this.editedItem = Object.assign({}, this.defaultItem);
         this.editedIndex = -1;
       }, 300);
     },
-    save () {
-      console.log('editedItem', this.editedItem);
+    save() {
+      console.log("editedItem", this.editedItem);
       if (this.editedIndex > -1) {
         Object.assign(this.desserts[this.editedIndex], this.editedItem);
       } else {
@@ -204,8 +255,8 @@ export default {
       }
       this.close();
     },
-    save1 () {
-      console.log('editedItem', this.editedItem);
+    save1() {
+      console.log("editedItem", this.editedItem);
       if (this.editedIndex > -1) {
         Object.assign(this.desserts[this.editedIndex], this.editedItem);
       } else {
@@ -213,17 +264,16 @@ export default {
       }
       this.close1();
     }
-  },
+  }
   // switchComponent (comp) {
   //   this.$emit('switchComp', comp);
   // }
 };
 </script>
 <style>
-#td{
-    border: 1px solid #dddddd;
-    text-align: left;
-    padding: 8px;
-   
+#td {
+  border: 1px solid #dddddd;
+  text-align: left;
+  padding: 8px;
 }
 </style>
diff --git a/src/pages/Dashboard.vue b/src/pages/Dashboard.vue
index f14c107..dc3a215 100644
--- a/src/pages/Dashboard.vue
+++ b/src/pages/Dashboard.vue
@@ -384,14 +384,19 @@
                       <label class="right">Country:</label>
                     </v-flex>
                     <v-flex xs6  class="ml-3">
-                      <v-text-field
+                      <!-- <v-text-field
                         placeholder="fill your country Name"   
                         :rules="countryRules"
                         v-model="editedItem.country"
                         type="text"
                         name="country"
                         required
-                      ></v-text-field>
+                      ></v-text-field> -->
+                        <v-select
+                         v-model="editedItem.country"
+                         :items="countries"
+                         label="fill your country Name"
+                       ></v-select>
                     </v-flex>
                   </v-layout>
                   <v-layout>
@@ -511,6 +516,7 @@ export default {
     loading3: false,
     loading4: false,
     details: [],
+    countries:['US','Canada'],
     AddUsercredentials: {},
     pagination: {
       rowsPerPage: 15
@@ -557,6 +563,7 @@ export default {
       name: "",
       lastname: "",
       email: "",
+      date: null,
       dob: ""
     },
     userName:'',
@@ -692,7 +699,7 @@ export default {
       if (this.$refs.form.validate()) {
         let addUsers = {
           name: this.editedItem.name + " " +this.editedItem.lastname,
-          dob: this.editedItem.dob,
+          dob: this.editedItem.date,
           email: this.editedItem.email,
           country: this.editedItem.country
         };
diff --git a/src/pages/questions.vue b/src/pages/questions.vue
index 8db4e7c..37deadc 100644
--- a/src/pages/questions.vue
+++ b/src/pages/questions.vue
@@ -1,13 +1,13 @@
 <template>
  <v-flex>
-   <app-toolbar class="app--toolbar"></app-toolbar>
-  <v-card>
+  <app-toolbar class="app--toolbar"></app-toolbar>
+   <v-card>
     <v-toolbar flat color="white">
-      <v-card-title>
-      <h3 style="position:relative; left:px; top:-5px;"><b>Forum Questions</b></h3>
-      <h5 style="position:relative; left:40px; top:-15px;">Select Category</h5>
-      <span style="position:relative; left:-95px; top:10px;">
-
+     <v-card-title>
+      <!-- <h3 style="position:relative; left:0px; top:-5px;"><b>Forum Questions</b></h3> -->
+      <h3><b>Forum Questions</b></h3>
+       <h5 style="position:relative;top:-15px;">Select Category</h5>
+        <!-- <span style="position:relative; left:-95px; top:10px;"> -->
         <v-btn color="grey darken-2" v-on:click="component='suggestion' , activebtn('existing')" v-bind:class="{ activebtn: isActivebtn }" flat>Suggestion</v-btn>
 
         <v-btn color="grey darken-2" v-on:click="component='sex' , activebtn('new')" v-bind:class="{ activebtn: Activebtn1 }" flat>Sex</v-btn>
@@ -17,10 +17,8 @@
         <v-btn color="grey darken-2" v-on:click="component='skin' , activebtn('new2')" v-bind:class="{ activebtn: Activebtn3 }" flat>Skin & Beauty</v-btn>
 
         <v-btn color="grey darken-2" v-on:click="component='diet' , activebtn('new3')" v-bind:class="{ activebtn: Activebtn4 }" flat>Diet & Ex</v-btn>
-
-      </span>
-      </v-card-title>
-      
+  
+      </v-card-title>      
     </v-toolbar>
     <component v-bind:is="component"></component>
   </v-card>