feat: add Team section in landing page

Relates #43

client/src/components/LandingPage/Team/StyledCompnents.js

@@ -8,6 +8,13 @@ export const CardWrapper = styled.div`
   font-family: 'Wallpoet', cursive;
   text-align: center;
   margin: 27px 9%;
+  @media (max-width: 720px) {
+    width: 335px;
+  }
+  @media (min-width: 1440px) {
+    width: 15%;
+    margin: 27px auto;
+  }
 `;
 
 export const ImageContainer = styled.div`
@@ -18,6 +25,12 @@ export const ImageContainer = styled.div`
   background-repeat: no-repeat;
   background-position: center;
   width: 100%;
+  @media (max-width: 720px) {
+    height: 270px;
+  }
+  @media (min-width: 1440px) {
+    height: 12vw;
+  }
 `;
 
 export const CardImage = styled.img`
@@ -43,3 +56,45 @@ export const UserSpecialty = styled.h2`
   color: var(--cyan);
   letter-spacing: -1.33px;
 `;
+
+// general team section elements
+
+export const TeamWrapper = styled.div`
+  text-align: center;
+`;
+
+export const TeamCardsWrapper = styled.div`
+  width: 100%;
+  display: flex;
+  justify-content: space-around;
+  flex-wrap: wrap;
+  margin-top: 2%;
+`;
+
+export const Header = styled.header`
+  position: relative;
+  min-height: 7vw;
+  color: #fff;
+`;
+
+export const HeaderImage = styled.img`
+  width: 80%;
+  min-width: 320px;
+  position: absolute;
+  transform: translate(-50%, -50%);
+  top: 50%;
+  left: 50%;
+  z-index: -1;
+`;
+
+export const Heading = styled.h1`
+  line-height: 90px;
+  position: absolute;
+  transform: translate(-50%, -50%);
+  top: 60%;
+  left: 50%;
+  font-family: 'Wallpoet', cursive;
+  margin-left: 1%;
+  font-size: 4vw;
+  font-size: calc(14px + (60 - 14) * ((100vw - 300px) / (1600 - 300)));
+`;

client/src/components/LandingPage/Team/index.js

@@ -0,0 +1,21 @@
+import React from 'react';
+
+import TeamCard from './TeamCard';
+import TeamHeaderImage from './team_header.png';
+import {
+  TeamWrapper,
+  Header,
+  TeamCardsWrapper,
+  HeaderImage,
+  Heading,
+} from './StyledCompnents';
+
+export default () => (
+  <TeamWrapper>
+    <Header>
+      <HeaderImage src={TeamHeaderImage} />
+      <Heading>Who We Are</Heading>
+    </Header>
+    <TeamCardsWrapper />
+  </TeamWrapper>
+);