diff --git a/client/src/components/Brand/brand.css b/client/src/components/Brand/brand.css
index ed09331..dd0e1fc 100644
--- a/client/src/components/Brand/brand.css
+++ b/client/src/components/Brand/brand.css
@@ -58,6 +58,7 @@ margin-right: 30px;
   display: flex;
   flex-direction: row;
   text-align: left !important;
+  margin-bottom: 3%;
 }
 .score1 {
   width: 170px;
@@ -124,7 +125,7 @@ margin-right: 30px;
   margin-bottom: 70px;
 }
 .MoreDetails {
-  margin-left: 17px;
+  margin-left: 10%;
   max-width: 100%;
   padding-top: 6%;
   text-align: left !important;
@@ -151,7 +152,9 @@ margin-right: 30px;
   height: 70px;
   border-radius: 5px;
 }
+
 .btn-metodolegy-brand {
+  margin-left: 20%;
   height: 40px;
   background-color: black;
   color: white;
@@ -166,8 +169,12 @@ margin-right: 30px;
   font-size: 12pt;
   font-family: "Roboto", sans-serif;
   font-weight: bold;
-  padding-left: -14px;
+  width: 24%
+}
+.name2 h3{
+  text-align: center;
 }
+
 .score22 h3 {
   text-align: center;
 }
@@ -289,9 +296,15 @@ margin-right: 30px;
 }
 .They-areas-they-are {
   display: initial;
+  text-align: center !important;
+  margin-left: 10% !important;
 }
 .pargrah-brand {
   margin-top: 10px;
+  width: 60%;
+  float: right;
+text-align: center;
+
 }
 
 .detail {
@@ -471,6 +484,7 @@ margin-right: 30px;
 }
 
 .details-feedback-container {
+  width: 100%;
   display: flex;
   flex-direction: row;
   float: left;
diff --git a/client/src/components/Brand/index.js b/client/src/components/Brand/index.js
index fbf9d8b..9a6e72f 100644
--- a/client/src/components/Brand/index.js
+++ b/client/src/components/Brand/index.js
@@ -2,12 +2,12 @@ import React from "react";
 import back from "./left.png";
 import "./brand.css";
 import axios from "axios";
-import Feedback from "../Feedback";
 import { FadeLoader } from "react-spinners";
 import { Link } from "react-router-dom";
 import defaultimage from "./x.jpg";
 import AddFeedback from "../Feedback/add.js";
 
+
 class Brand extends React.Component {
   state = {
     info: [],
@@ -164,12 +164,13 @@ class Brand extends React.Component {
                     <h3> {environmentscore}</h3>
                   </div>
                   <h3 className="name2">Environment Rating </h3>
+                  <div className="pargrah-brand">
+                    <p className="They-areas-they-are">
+                      {ReasonForEnvironmentScore}
+                    </p>
+                  </div>
                 </div>
-                <div className="pargrah-brand">
-                  <p className="They-areas-they-are">
-                    {ReasonForEnvironmentScore}
-                  </p>
-                </div>
+
                 <div className="labour2">
                   <div
                     className="score22"
@@ -180,9 +181,12 @@ class Brand extends React.Component {
                     <h3> {labourscore}</h3>{" "}
                   </div>
                   <h3 className="name2">Labour Rating </h3>
-                </div>
-                <div className="pargrah-brand">
+                  <div className="pargrah-brand">
                   <p className="They-areas-they-are">{ReasonForLabourScore}</p>
+
+                  </div>
+
+                </div>
                   <div className="labour2">
                     <div
                       className="score22"
@@ -193,10 +197,12 @@ class Brand extends React.Component {
                       <h3> {transparencyscore}</h3>
                     </div>
                     <h3 className="name2">Transparency Rating </h3>
-                  </div>
-                  <p className="They-areas-they-are">
-                    {ReasonForTransparencyScore}
-                  </p>
+                    <div className="pargrah-brand">
+                    <p className="They-areas-they-are">
+                      {ReasonForTransparencyScore}
+                    </p>
+                    </div>
+
                 </div>
                 <Link to="/methodology">
                   <div className="btn-metodolegy-brand">
@@ -207,9 +213,6 @@ class Brand extends React.Component {
               </div>
             </div>
 
-            <div className="feedback-section">
-              <Feedback name={name} />
-            </div>
           </div>
           <AddFeedback name={name} />
         </div>
diff --git a/client/src/components/Feedback/feedback.css b/client/src/components/Feedback/feedback.css
deleted file mode 100644
index 92a477b..0000000
--- a/client/src/components/Feedback/feedback.css
+++ /dev/null
@@ -1,210 +0,0 @@
-.mainf {
-  border: solid gray 1px;
-  margin-left: 14px;
-  margin-top: 47px;
-  height: 488px;
-  width: 88%;
-}
-
-.result img {
-  width: 100px;
-  height: 100px;
-}
-.header {
-  display: inline-flex;
-  margin-top: 2%;
-  float: left;
-}
-
-.btn-metodo {
-  height: 40px;
-  background-color: black;
-  color: white;
-  margin-bottom: 20px;
-
-  display: flex;
-
-  justify-content: center;
-
-  align-items: center;
-
-  width: 498px;
-
-  margin-left: 32px;
-}
-
-.header img {
-  width: 50px;
-  height: 50px;
-  float: left;
-}
-
-.feedbackcard {
-  display: inline-flex;
-}
-
-.feedbackcard img {
-  width: 60px;
-  height: 60px;
-  margin-top: 17px;
-}
-
-.nameuser {
-  margin-left: 40px;
-  padding-top: 0px !important;
-  margin-right: 10%;
-}
-
-.votes img {
-  width: 25px;
-  height: 25px;
-  margin-right: 30px;
-}
-
-.votes p {
-  margin-right: 30px;
-}
-
-.votes {
-  display: inline-flex;
-  margin-left: 15%;
-}
-.line {
-  border-left: 1px solid #000;
-  height: 415px;
-}
-
-.line2 {
-  border-bottom: 1px solid #000;
-  width: 500px;
-  margin-bottom: 10px;
-  margin-left: 15px;
-}
-
-.votes p {
-  border: 1px solid #000;
-  border-radius: 50%;
-  text-align: center;
-}
-
-.mainorg {
-  display: inline-flex;
-
-  padding-left: 30px;
-}
-
-.allcards {
-  display: inline-block;
-}
-.cards {
-  padding-left: 5%;
-  text-align: left !important;
-}
-.carduser {
-  text-align: left !important;
-}
-
-.like button {
-  background-color: Transparent;
-  border: none;
-}
-.dislike button {
-  background-color: Transparent;
-  border: none;
-}
-
-.sweet-loading {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  color: #1389a6;
-}
-
-@media only screen and (max-width: 600px) {
-  .header {
-    display: flex;
-  }
-  .header h3 {
-    font-size: 10pt;
-    margin-right: 46%;
-  }
-  .header img {
-    width: 50px;
-    height: 50px;
-    float: left;
-  }
-
-  .feedbackcard {
-    display: flex;
-    margin-right: 40%;
-    width: 30%;
-  }
-
-  .feedbackcard img {
-    width: 60px;
-    height: 60px;
-    margin-top: 12px;
-  }
-  .feedbackcard h4 {
-    font-size: 8pt;
-  }
-  .feedbackcard h5 {
-    font-size: 6pt;
-  }
-
-  .nameuser {
-    margin-left: 6px;
-    padding-top: 0px !important;
-    margin-right: 10%;
-  }
-
-  .votes img {
-    width: 17px;
-    height: 20px;
-    margin-right: 30px;
-  }
-
-  .votes p {
-    margin-right: 30px;
-  }
-
-  .votes {
-    display: inline-flex;
-  }
-  .line {
-    border-left: 1px solid #000;
-    height: 359px;
-  }
-
-  .line2 {
-    border-bottom: 1px solid #000;
-    width: 500px;
-    margin-bottom: 10px;
-    margin-left: 15px;
-  }
-
-  .votes p {
-    border: 1px solid #000;
-    border-radius: 50%;
-    text-align: center;
-  }
-
-  .mainorg {
-    display: inline-flex;
-    width: 60%;
-  }
-
-  .allcards {
-    display: inline-block;
-  }
-  .cards {
-    padding-left: 2%;
-  }
-
-  .sweet-loading {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    color: #1389a6;
-  }
-}
diff --git a/client/src/components/Feedback/index.js b/client/src/components/Feedback/index.js
deleted file mode 100644
index bb1267a..0000000
--- a/client/src/components/Feedback/index.js
+++ /dev/null
@@ -1,159 +0,0 @@
-import React, { Component } from "react";
-import "./feedback.css";
-import lamba from "./assets/lamba.png";
-import user from "./assets/user.png";
-import like from "./assets/like.png";
-import dislike from "./assets/dislike.png";
-import AddFeedback from "./add.js";
-import axios from "axios";
-import { FadeLoader } from "react-spinners";
-
-export default class Feedback extends Component {
-  state = {
-    info: [],
-    loading: false,
-    ids: [],
-    NoData: ""
-  };
-  componentDidMount() {
-    const { name } = this.props;
-    axios
-      .get(`/api/getfeedback/${name}`)
-      .then(({ data }) => {
-        if (data.length === 3) {
-          this.state.ids.push(
-            Object.keys(data[0])[0],
-            Object.keys(data[1])[0],
-            Object.keys(data[2])[0]
-          );
-          this.state.info.push(
-            Object.values(data[0]),
-            Object.values(data[1]),
-            Object.values(data[2])
-          );
-          this.setState({
-            loading: true
-          });
-        } else if (data.length === 2) {
-          this.state.ids.push(Object.keys(data[0])[0], Object.keys(data[1])[0]);
-          this.state.info.push(Object.values(data[0]), Object.values(data[1]));
-          this.setState({
-            loading: true
-          });
-        } else if (data.length === 1) {
-          this.state.ids.push(Object.keys(data[0])[0]);
-          this.state.info.push(Object.values(data[0]));
-          this.setState({
-            loading: true
-          });
-        } else {
-          this.setState({
-            NoData: "No Feedback For this Brand"
-          });
-        }
-      })
-      .catch(err => {
-        console.log(err);
-      });
-  }
-
-  like = (id, like) => {
-    const idfeedback = this.state.ids[id];
-    axios
-      .get(`/api/like/${idfeedback}/${like}`)
-      .then(({ data: { success } }) => {
-        if (success) {
-          window.location.reload();
-        } else {
-          console.log("error");
-        }
-      })
-      .catch(err => {
-        console.log(err);
-      });
-  };
-
-  dislike = (id, dislike) => {
-    const idfeedback = this.state.ids[id];
-    axios
-      .get(`/api/dislike/${idfeedback}/${dislike}`)
-      .then(({ data: { success } }) => {
-        if (success) {
-          window.location.reload();
-        } else {
-          console.log("error");
-        }
-      })
-      .catch(err => {
-        console.log(err);
-      });
-  };
-
-  render() {
-    return (
-      <div className="maina">
-        <div className="mainf">
-          <div className="feedback">
-            <div className="header">
-              <img src={lamba} alt="lamba" />
-              <h3>What does the community think about {this.props.name} </h3>
-            </div>
-            <div className="mainorg">
-              <div className="cards">
-                <h3>Feedback</h3>
-                <h3>{this.state.NoData}</h3>
-                {this.state.info.length !== 0 ? (
-                  this.state.info.map((i, id) => {
-                    return (
-                      <div className="allcards">
-                        <div className="carduser">
-                          <div className="feedbackcard">
-                            <img src={user} alt="user" />
-                            <div className="nameuser">
-                              <h4>Name</h4>
-                              <h5>{i[0].Name}</h5>
-                            </div>
-                            <div className="feedback">
-                              <h4>Feedback</h4>
-                              <h5>{i[0].feedback}</h5>
-                            </div>
-                            <div className="votes">
-                              <div className="like">
-                                <button
-                                  onClick={() => this.like(id, i[0].like)}
-                                >
-                                  <img src={like} alt="like" />
-                                  <p>{i[0].like}</p>
-                                </button>
-                              </div>
-                              <div className="dislike">
-                                <button
-                                  onClick={() => this.dislike(id, i[0].dislike)}
-                                >
-                                  <img src={dislike} alt="dislike" />
-                                  <p>{i[0].dislike}</p>
-                                </button>
-                              </div>
-                            </div>
-                          </div>
-                        </div>
-                      </div>
-                    );
-                  })
-                ) : (
-                  <div className="sweet-loading">
-                    <FadeLoader
-                       color={"black"}
-                      loading={this.state.loading}
-                    />
-                  </div>
-                )}
-              </div>
-            </div>
-          </div>
-          <div className="btn-metodo"> submit your feedback below</div>
-        </div>
-      </div>
-    );
-  }
-}
diff --git a/client/src/components/Header/header.css b/client/src/components/Header/header.css
index 4eabdd7..9812ea7 100644
--- a/client/src/components/Header/header.css
+++ b/client/src/components/Header/header.css
@@ -5,6 +5,7 @@
   padding-left: 5px;
 }
 
+
 .nav h3 {
   text-align: center;
   font-family: "Alegreya Sans SC", sans-serif;