diff --git a/src/components/utils/Home/quickLink.js b/src/components/utils/Home/quickLink.js
index 11593e1..a0c8b06 100644
--- a/src/components/utils/Home/quickLink.js
+++ b/src/components/utils/Home/quickLink.js
@@ -32,217 +32,220 @@ const QuickLinks = () => {
       <div ref={ref}>
         <motion.div animate={animation}>
           {/* QuickLinks */}
-          <div className="row">
-            <div className="quicklinks">
-              <h2 className="text-center mt-2">
-                {" "}
-                <img
-                  className="img"
-                  src="https://res.cloudinary.com/dd6idpm2e/image/upload/v1655536300/link_1_dxwycj.png"
-                  alt="Error loading "
-                />{" "}
-                Quick Links
-              </h2>
-              <div className="rowQLbig">
-                <motion.h4
-                  whileHover={{ scale: 1.1 }}
-                  whileTap={{ scale: 0.9 }}
-                >
+          <div className="row-head">
+            <div className="row-quick">
+              <div className="quicklinks">
+                <h2 className="text-center mt-2">
                   {" "}
                   <img
                     className="img"
-                    style={{ height: "50px", width: "50px" }}
-                    src="https://s3.ap-south-1.amazonaws.com/assets.ynos.in/startup-logos/YNOS336741.jpg"
+                    src="https://res.cloudinary.com/dd6idpm2e/image/upload/v1655536300/link_1_dxwycj.png"
                     alt="Error loading "
                   />{" "}
-                  <a
-                    style={{ textDecoration: "none", color: "#000" }}
-                    href="https://app.joinsuperset.com/#/s/feed"
-                    target="_blank"
-                    rel="noreferrer"
+                  Quick Links
+                </h2>
+                <div className="rowQLbig">
+                  <motion.h4
+                    whileHover={{ scale: 1.1 }}
+                    whileTap={{ scale: 0.9 }}
                   >
-                    Login to Superset
-                  </a>
-                </motion.h4>
-                <motion.h4
-                  whileHover={{ scale: 1.1 }}
-                  whileTap={{ scale: 0.9 }}
-                >
-                  {" "}
-                  <img
-                    className="img"
-                    src="https://res.cloudinary.com/dd6idpm2e/image/upload/v1655536006/communicate_1_o8akqp.png"
-                    alt="Error loading "
-                  />{" "}
-                  <Link className="link" to="/studentCoordinators">
                     {" "}
-                    Contact Us
-                  </Link>
-                </motion.h4>
-
-                <Popup
-                  trigger={
-                    <motion.h4
-                      whileHover={{ scale: 1.1 }}
-                      whileTap={{ scale: 0.9 }}
-                      className="save-button"
+                    <img
+                      className="img"
+                      style={{ height: "50px", width: "50px" }}
+                      src="https://s3.ap-south-1.amazonaws.com/assets.ynos.in/startup-logos/YNOS336741.jpg"
+                      alt="Error loading "
+                    />{" "}
+                    <a
+                      style={{ textDecoration: "none", color: "#000" }}
+                      href="https://app.joinsuperset.com/#/s/feed"
+                      target="_blank"
+                      rel="noreferrer"
                     >
+                      Login to Superset
+                    </a>
+                  </motion.h4>
+                  <motion.h4
+                    whileHover={{ scale: 1.1 }}
+                    whileTap={{ scale: 0.9 }}
+                  >
+                    {" "}
+                    <img
+                      className="img"
+                      src="https://res.cloudinary.com/dd6idpm2e/image/upload/v1655536006/communicate_1_o8akqp.png"
+                      alt="Error loading "
+                    />{" "}
+                    <Link className="link" to="/studentCoordinators">
                       {" "}
-                      <img
-                        className="img"
-                        alt="Error loading "
-                        src="https://res.cloudinary.com/dd6idpm2e/image/upload/v1655536006/brochure_1_gl6ekz.png"
-                      />{" "}
-                      Brochures
-                    </motion.h4>
-                  }
-                  on={"hover"}
-                  position="bottom left"
-                >
-                  <div className="hid1">
-                    <ul>
-                      <li>
-                        <a href="http://www.mmmut.ac.in/Pdf/T&P%20Placement%20Brochure%202022-23.pdf">
-                          Placement Brochure 2021-2022
-                        </a>
-                      </li>
-                      <li>
-                        <a href="#">Placement Brochure 2020-2021</a>
-                      </li>
-                      <li>
-                        <a href="#">Placement Brochure 2019-2020</a>
-                      </li>
-                      <li>
-                        <a href="#">Placement Brochure 2018-2019</a>
-                      </li>
-                    </ul>
-                  </div>
-                </Popup>
+                      Contact Us
+                    </Link>
+                  </motion.h4>
 
-                <motion.h4
-                  className="placementStats"
-                  whileHover={{ scale: 1.05 }}
-                  whileTap={{ scale: 0.9 }}
-                >
-                  {" "}
-                  <img
-                    className="img"
-                    src="https://res.cloudinary.com/dd6idpm2e/image/upload/v1655536006/analytics_1_1_yusxhi.png"
-                    alt="Error loading "
-                  />{" "}
-                  <Link to="/placement_training" className="link">
-                    Placement Statistics & Trainings
-                  </Link>
-                </motion.h4>
+                  <Popup
+                    trigger={
+                      <motion.h4
+                        whileHover={{ scale: 1.1 }}
+                        whileTap={{ scale: 0.9 }}
+                        className="save-button"
+                      >
+                        {" "}
+                        <img
+                          className="img"
+                          alt="Error loading "
+                          src="https://res.cloudinary.com/dd6idpm2e/image/upload/v1655536006/brochure_1_gl6ekz.png"
+                        />{" "}
+                        Brochures
+                      </motion.h4>
+                    }
+                    on={"hover"}
+                    position="bottom left"
+                  >
+                    <div className="hid1">
+                      <ul>
+                        <li>
+                          <a href="http://www.mmmut.ac.in/Pdf/T&P%20Placement%20Brochure%202022-23.pdf">
+                            Placement Brochure 2021-2022
+                          </a>
+                        </li>
+                        <li>
+                          <a href="#">Placement Brochure 2020-2021</a>
+                        </li>
+                        <li>
+                          <a href="#">Placement Brochure 2019-2020</a>
+                        </li>
+                        <li>
+                          <a href="#">Placement Brochure 2018-2019</a>
+                        </li>
+                      </ul>
+                    </div>
+                  </Popup>
+
+                  <motion.h4
+                    className="placementStats"
+                    whileHover={{ scale: 1.05 }}
+                    whileTap={{ scale: 0.9 }}
+                  >
+                    {" "}
+                    <img
+                      className="img"
+                      src="https://res.cloudinary.com/dd6idpm2e/image/upload/v1655536006/analytics_1_1_yusxhi.png"
+                      alt="Error loading "
+                    />{" "}
+                    <Link to="/placement_training" className="link">
+                      Placement Statistics & Trainings
+                    </Link>
+                  </motion.h4>
+                </div>
               </div>
             </div>
-          </div>
-          <div className="row">
-            <div className="quicklinks">
-              <h2 className="text-center mt-2">
-                {" "}
-                <img
-                  src="https://res.cloudinary.com/dltqjc99w/image/upload/v1658265845/cell/download_1_hs3qzf.png"
-                  className="img"
-                  alt="Error loading  "
-                />{" "}
-                Downloads
-              </h2>
-              <div className="rowQLbig">
-                <Popup
-                  trigger={
-                    <motion.h4
-                      whileHover={{ scale: 1.1 }}
-                      whileTap={{ scale: 0.9 }}
-                    >
-                      {" "}
-                      <img
-                        src="https://res.cloudinary.com/dd6idpm2e/image/upload/v1657597253/report_1_mlgglr.png"
-                        className="img"
-                        alt="Error loading "
-                      />{" "}
-                      Placement Reports
-                    </motion.h4>
-                  }
-                  // modal="true"
-                  on={"hover"}
-                  position="bottom right"
-                >
-                  <div className="hid1">
-                    <ul>
-                      <li>
-                        <a href="http://www.mmmut.ac.in/pdf/TNP2021-22.pdf">
-                          Placement Report 2021-2022
-                        </a>
-                      </li>
-                      <li>
-                        <a href="http://www.mmmut.ac.in/pdf/TNP2020-21a.pdf">
-                          Placement Report 2020-2021
-                        </a>
-                      </li>
-                      <li>
-                        <a href="http://www.mmmut.ac.in/pdf/2019-20.pdf">
-                          Placement Report 2019-2020
-                        </a>
-                      </li>
-                      <li>
-                        <a href="http://www.mmmut.ac.in/pdf/2018-19.pdf">
-                          Placement Report 2018-2019
-                        </a>
-                      </li>
-                      <li>
-                        <a href="http://www.mmmut.ac.in/pdf/2017-18.pdf">
-                          Placement Report 2017-2018
-                        </a>
-                      </li>
-                    </ul>
-                  </div>
-                </Popup>
-                <motion.h4
-                  whileHover={{ scale: 1.1 }}
-                  whileTap={{ scale: 0.9 }}
-                >
+
+            <div className="row-quick">
+              <div className="quicklinks">
+                <h2 className="text-center mt-2">
                   {" "}
                   <img
-                    src="https://res.cloudinary.com/dd6idpm2e/image/upload/v1657648277/insurance_1_ufp80u.png "
+                    src="https://res.cloudinary.com/dltqjc99w/image/upload/v1658265845/cell/download_1_hs3qzf.png"
                     className="img"
                     alt="Error loading  "
                   />{" "}
-                  <a
-                    href="https://res.cloudinary.com/vaish1101/image/upload/v1658241167/gyan%20sir/T_P_Policy_2022_kf9g0e.pdf"
-                    className="link"
+                  Downloads
+                </h2>
+                <div className="rowQLbig">
+                  <Popup
+                    trigger={
+                      <motion.h4
+                        whileHover={{ scale: 1.1 }}
+                        whileTap={{ scale: 0.9 }}
+                      >
+                        {" "}
+                        <img
+                          src="https://res.cloudinary.com/dd6idpm2e/image/upload/v1657597253/report_1_mlgglr.png"
+                          className="img"
+                          alt="Error loading "
+                        />{" "}
+                        Placement Reports
+                      </motion.h4>
+                    }
+                    // modal="true"
+                    on={"hover"}
+                    position="bottom right"
                   >
-                    Placement Policy
-                  </a>
-                </motion.h4>
-                <motion.h4
-                  whileHover={{ scale: 1.1 }}
-                  whileTap={{ scale: 0.9 }}
-                >
-                  {" "}
-                  <img
-                    src="https://res.cloudinary.com/dd6idpm2e/image/upload/v1657597836/templates_1_xyrfpr.png"
-                    className="img"
-                    alt="Error loading  "
-                  />{" "}
-                  <a className="link" href="https://bit.ly/3zhzNVy">
-                    Resume Template
-                  </a>
-                </motion.h4>
-                <motion.h4
-                  whileHover={{ scale: 1.1 }}
-                  whileTap={{ scale: 0.9 }}
-                >
-                  {" "}
-                  <img
-                    src="https://res.cloudinary.com/dd6idpm2e/image/upload/v1657648352/invitation_1_t0whud.png"
-                    className="img"
-                    alt="Error loading  "
-                  />{" "}
-                  <Link to="/invite" className="link">
-                    Invitation
-                  </Link>
-                </motion.h4>
+                    <div className="hid1">
+                      <ul>
+                        <li>
+                          <a href="http://www.mmmut.ac.in/pdf/TNP2021-22.pdf">
+                            Placement Report 2021-2022
+                          </a>
+                        </li>
+                        <li>
+                          <a href="http://www.mmmut.ac.in/pdf/TNP2020-21a.pdf">
+                            Placement Report 2020-2021
+                          </a>
+                        </li>
+                        <li>
+                          <a href="http://www.mmmut.ac.in/pdf/2019-20.pdf">
+                            Placement Report 2019-2020
+                          </a>
+                        </li>
+                        <li>
+                          <a href="http://www.mmmut.ac.in/pdf/2018-19.pdf">
+                            Placement Report 2018-2019
+                          </a>
+                        </li>
+                        <li>
+                          <a href="http://www.mmmut.ac.in/pdf/2017-18.pdf">
+                            Placement Report 2017-2018
+                          </a>
+                        </li>
+                      </ul>
+                    </div>
+                  </Popup>
+                  <motion.h4
+                    whileHover={{ scale: 1.1 }}
+                    whileTap={{ scale: 0.9 }}
+                  >
+                    {" "}
+                    <img
+                      src="https://res.cloudinary.com/dd6idpm2e/image/upload/v1657648277/insurance_1_ufp80u.png "
+                      className="img"
+                      alt="Error loading  "
+                    />{" "}
+                    <a
+                      href="https://res.cloudinary.com/vaish1101/image/upload/v1658241167/gyan%20sir/T_P_Policy_2022_kf9g0e.pdf"
+                      className="link"
+                    >
+                      Placement Policy
+                    </a>
+                  </motion.h4>
+                  <motion.h4
+                    whileHover={{ scale: 1.1 }}
+                    whileTap={{ scale: 0.9 }}
+                  >
+                    {" "}
+                    <img
+                      src="https://res.cloudinary.com/dd6idpm2e/image/upload/v1657597836/templates_1_xyrfpr.png"
+                      className="img"
+                      alt="Error loading  "
+                    />{" "}
+                    <a className="link" href="https://bit.ly/3zhzNVy">
+                      Resume Template
+                    </a>
+                  </motion.h4>
+                  <motion.h4
+                    whileHover={{ scale: 1.1 }}
+                    whileTap={{ scale: 0.9 }}
+                  >
+                    {" "}
+                    <img
+                      src="https://res.cloudinary.com/dd6idpm2e/image/upload/v1657648352/invitation_1_t0whud.png"
+                      className="img"
+                      alt="Error loading  "
+                    />{" "}
+                    <Link to="/invite" className="link">
+                      Invitation
+                    </Link>
+                  </motion.h4>
+                </div>
               </div>
             </div>
           </div>
diff --git a/src/style/frontPage.css b/src/style/frontPage.css
index df69d73..ef5238d 100644
--- a/src/style/frontPage.css
+++ b/src/style/frontPage.css
@@ -13,6 +13,83 @@
   word-break: normal;
 }
 
+.row-head {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-items: center;
+  justify-content: center;
+}
+
+.row-quick {
+  display: flex;
+  width: 100%;
+  align-items: center;
+  justify-items: center;
+  justify-content: center;
+}
+
+.quicklinks {
+  width: 60%;
+  height: fit-content;
+  margin: 1.2rem auto;
+  justify-items: center;
+  background: #f5f9ff;
+  border: 1px solid #212121;
+  border-radius: 15px;
+}
+
+.link {
+  text-decoration: none;
+  color: black;
+}
+
+.quicklinks .rowQLbig {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+  margin: auto;
+  align-items: center;
+}
+
+.quicklinks h4 {
+  margin: 1.5rem;
+  cursor: pointer;
+  flex-grow: 1;
+}
+.img {
+  margin-right: 10px;
+}
+
+.popup-content {
+  margin: auto !important;
+  height: 150px !important;
+  padding: 10px !important;
+}
+
+[role="tooltip"].popup-content {
+  width: 325px !important;
+  box-shadow: rgba(0, 0, 0, 0.16) 0px 0px 3px !important;
+}
+
+.popup-overlay {
+  background: rgba(0, 0, 0, 0.5) !important;
+}
+[data-popup="tooltip"].popup-overlay {
+  background: transparent !important;
+}
+
+.quicklinks .hid1 ul li {
+  text-decoration: none !important;
+  font-family: "Montserrat";
+  font-style: normal;
+  font-weight: 500;
+  font-size: 17px;
+  line-height: 24 px;
+  text-align: center;
+  list-style: none;
+  color: #457b9d;
+}
+
 #aboutBor {
   width: 170px;
 }
@@ -26,6 +103,19 @@
   width: 23rem;
 }
 
+@media (max-width: 768px) {
+  .quicklinks {
+    width: 80%;
+  }
+
+  .quicklinks h4 {
+    margin: 1rem;
+  }
+
+  .quicklinks .rowQL {
+    width: 100%;
+  }
+}
 @media (max-width: 760px) {
   #aboutVCM {
     width: 30rem;