Fixed some alignment issues.

src/agent-page/AgentPage.js

@@ -1,7 +1,6 @@
 import React, { Component } from "react";
 import Agents from './Agents'
 import './agent-page.css';
-import Carousel from 'react-bootstrap/Carousel'
 import Agent1 from "../images/Agent1.jpg";
 import Agent2 from "../images/Agent2.jpg";
 import Agent3 from "../images/Agent3.jpg";

src/agent-page/Agents.js

@@ -1,5 +1,4 @@
 import React from "react";
-import AgentPage from "./AgentPage";
 /* import {Link} from 'react-router-dom' */
 import Card from "react-bootstrap/Card";
 import Button from "react-bootstrap/Button";
@@ -9,15 +8,17 @@ const Agents = ({ agents }) => {
     return (
       <div className="agent" key={agent.id}>
         {}
-            <Card style={{ width: "22rem", height: "40rem"  }}>
+        <Card style={{ width: "22rem", height: "42rem" }}>
           <Card.Img variant="top" style={{ height: "22rem" }} src={agent.src} />
           <Card.Body>
             <Card.Title>{agent.title}</Card.Title>
             <Card.Text>{agent.name}</Card.Text>
-                <Card.Text>
+            <Card.Text style={{ height: "7rem" }}>
               {agent.word}
             </Card.Text>
+            <div className="buttonfriend">
               <Button variant="primary">VIEW</Button>
+            </div>
           </Card.Body>
         </Card>
       </div>

src/agent-page/agent-page.css

@@ -21,3 +21,8 @@
   .agent{
     padding-left: 16%;
   }
+  
+  .buttonfriend{
+    padding-top: 15px;
+    padding-left: 120px;
+  }

src/listings-page/ListingsPage.js

@@ -1,3 +1,4 @@
+// eslint-disable-next-line
 import React, { useState, useEffect, Component } from "react";
 import {
   GoogleMap,

src/listings-page/mapStyles.js

@@ -1,3 +1,4 @@
+// eslint-disable-next-line
 export default [
     {
         "featureType": "all",

src/shared-components/navbar-component/Navbar.js

@@ -6,13 +6,13 @@ const Navbar = () => {
   return (
     /* Nav Bar */
     <div className="Navbar">
-      <nav class="navbar navbar-expand-lg navbar-dark">
-        <img src=""></img>
-        <a href="/" class="navbar-brand">
+      <nav className="navbar navbar-expand-lg navbar-dark">
+        <img src="" alt="Logo&emsp;"></img>
+        <a href="/" className="navbar-brand">
           Kene's Cribs
         </a>
         <button
-          class="navbar-toggler"
+          className="navbar-toggler"
           type="button"
           data-toggle="collapse"
           data-target="#navbarTogglerDemo02"
@@ -20,22 +20,22 @@ const Navbar = () => {
           aria-expanded="false"
           aria-label="Toggle navigation"
         >
-          <span class="navbar-toggler-icon"></span>
+          <span className="navbar-toggler-icon"></span>
         </button>
-        <div class="collapse navbar-collapse" id="navbarTogglerDemo02">
-          <ul class="navbar-nav ml-auto">
-            <li class="nav-item">
-              <Link class="nav-link" exact to="/">
+        <div className="collapse navbar-collapse" id="navbarTogglerDemo02">
+          <ul className="navbar-nav ml-auto">
+            <li className="nav-item">
+              <Link className="nav-link" exact to="/">
                 Home
               </Link>
             </li>
-            <li class="nav-item">
-              <Link class="nav-link" to="/listings">
+            <li className="nav-item">
+              <Link className="nav-link" to="/listings">
                 Listings
               </Link>
             </li>
-            <li class="nav-item">
-              <Link class="nav-link" to="/agents">
+            <li className="nav-item">
+              <Link className="nav-link" to="/agents">
                 Agents
               </Link>
             </li>