@font-face {
  font-family: 'Source-sans-pro-Regular';
  src: url(fonts/SourceSansPro-Regular.otf);
}

@font-face {
  font-family: 'Source-sans-pro-Bold';
  src: url(fonts/SourceSansPro-Bold.otf);
}

@font-face {
  font-family: 'Source-sans-pro-Light';
  src: url(fonts/SourceSansPro-Light.otf);
}


body {
  display: block;
  margin: 0px;
  max-width: 100%;
  font-family: Source-sans-pro-Light;
}

.navy {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: flex-end;
  width: 1103px;
  padding-top: 35px;
  margin-left: auto;
  margin-right: auto;

}

ul {
  list-style-type: none;
  display: flex;
  padding-left: 702px;
}

li a {
  text-decoration: none;
  padding-left: px;
  padding-right: 30px;
  color: white;
  font-size: 12px;

}

header {
  background: url(images/pics/pic_1.jpg) no-repeat;
  background-size: cover;
  padding-bottom: 104px;
}

.people h1 {
  display: flex;
  justify-content: center;
  padding-top: 101px;
  font-size: 120px;
  text-align: center;
  font-family: 'Source-sans-pro-Bold';
  font-weight: 700px;
  color: white;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 0;

}

.people p {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  word-spacing: 5rem;
  color: white;
  font-family: Source-sans-pro-Bold;
  padding-bottom: 25px;
  margin-top: auto;

}

.people button {
  display: block;
  margin-left: auto;
  margin-right: auto;
  border-radius: 3rem;
  height: 2.5rem;
  width: 10rem;
  background-color: #C271FF;
  color: white;
  border: 0;
  box-shadow: 0px 2px 20px 0px rgb(0, 0, 0, 0.50);
}

.learn-pros h2 {
  color: white;
  text-align: center;
  font-weight: 100;
  display: flex;
  justify-content: center;
  padding-top: 181px;
  margin-bottom: 55px;
  font-size: 2rem;

}

.learn-pros h2 b {
  color: #C271FF;
  font-family: Source-sans-pro-Bold;
  font-weight: 800;
  padding-right: .5rem;

}

.pros {
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  color: white;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 6rem;
  width: 1009px;
  height: 237px;
}

.pros div {}

.pros img {
  border-radius: 30rem;
  width: 150px;
  height: 150px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  justify-content: center;

}

.pros h3 {
  display: flex;
  justify-content: center;
  align-items: flex-start;
}

.pros p {
  text-align: center;
  width: 150px;
  margin-left: auto;
  margin-right: auto;
  font-style: italic;
  font-size: 16px;
  font-weight: 400px;
}

.smile_wrap {
  display: flex;
  flex-direction: column;
  justify-content: center;
  background-color: #C271FF;
  height: 392px;
}

.smiling-man {
  /* padding-bottom: 3rem;
  padding-top: 3rem; */
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-left: auto;
  margin-right: auto;
}

.smiling-man img {
  border-radius: 30rem;
  padding-right: 1rem;
  padding-top: 1rem;
  padding-left: 1rem;
  padding-bottom: 1rem;
  height: 160px;
  width: 160px;
}

.text_smiling {
  width: 730px;
  margin-top: auto;
}

.smile-wrap .smiling-man p {
  color: white;
  text-align: left;
  margin-inline-start: 0;
}




.smiling-man div :nth-child(4) {
  color: white;
  font-weight: 800;
  font-family: 'Source-sans-pro-Bold';
  font-size: 22px;
  padding-top: 22px;
  margin-bottom: 0;

}

.smiling-man div :nth-child(2) {
  color: white;
  font-weight: 800;
  margin-left: 0;
  font-size: 22px;

}

.smiling-man div :nth-child(5) {
  color: white;
  font-weight: 800;
  font-size: 22px;
  margin-top: 0;
  margin-bottom: 0;
}

.mpt-h1 {
  display: flex;
  justify-content: center;
  margin-top: 87px;
  margin-bottom: 75px;
  font-family: Source-sans-pro-Light;
  font-weight: 100;
}

.mpt {
  display: flex;
  flex-direction: row;
  justify-content: space-evenly;
  margin-left: auto;
  margin-right: auto;
  width: 1228px;
  height: 450px;
}


.mpt .card img {
  display: flex;
  justify-content: center;
  height: auto;
  max-height: 154px;
  max-width: 255px;
}

.mpt .card {
  display: flex;
  flex-direction: column;
  padding-left: 1rem;
  padding-right: 1rem;
  width: 255px;
  height: 355px;


}

/* Directly affects the paragraph in the .card and not anything else*/
/* .mpt .card :not(img) {
  margin-top: 0;
  padding-left: .5rem;
  padding-right: .5rem;
} */

.mpt .card h2 {
  color: #071629;
  font-size: 16px;
  font-family: 'Source-sans-pro-Bold';
  padding-left: 13px;
}

.mpt .card .prof h3 {
  color: #C271FF;
  font-size: 14px;
  font-weight: 600;
  margin-top: auto;
  margin-bottom: auto;
  padding-left: 13px;

}

.mpt .card .prof {
  display: flex;
  padding-bottom: 1rem;
}

.mpt .card .prof img {
  border-radius: 30px;
  max-height: 30px;
  max-width: 30px;
  margin-left: 13px;
}

.mpt .card #stars {
  display: flex;
  flex-direction: row;
  margin-left: auto;
  margin-top: auto;
  padding-left: 13px;
}

.mpt .card div #stars img {
  width: 14px;
  height: 100%;
  max-width: 1rem;
  max-height: 3rem;
  padding-right: .25rem;
}

.mpt .card div #stars p {
  display: flex;
  flex-direction: row;
  margin-left: auto;
  margin-top: auto;
  margin-top: auto;
  margin-bottom: auto;
  font-size: 14px;
  font-weight: 800;
  color: #C271FF;
}

.mpt p {
  color: black;
  font-size: 14px;
  display: flex;
  margin-top: 7.6px;
  padding-left: 13px;
}


.thumbnail {
  position: relative;
  max-width: 255px;
  max-height: 154px;
}

/* .video_image {
  width: 100%;
  height: auto;
} */

.overlay {
  transform: translate(-50%, -50%);
  position: absolute;
  top: 50%;
  left: 50%;
  width: 64px;
  height: 64px;
}



/* .mpt-videos {
  display: flex;
  margin-left: auto;
  margin-right: auto;
  justify-content: center;
} */

.mpt-h1 b {
  color: #C271FF;
  font-family: 'Source-sans-pro-Bold';
  font-weight: 800;
  padding-right: .5rem;
  padding-left: .5rem;

}

.free-mem {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  background-color: #071629;
  color: white;
  padding-bottom: 2rem;
  text-align: center;
  height: 502px;

}

.free-mem h1 {
  text-align: center;
  font-size: 32px;
  font-weight: 700;
  margin-top: 70px;
  margin-bottom: 58px;
}

.free-mem h1 b {
  color: #C271FF;
  font-family: 'Source-sans-pro-Bold';
  font-weight: 300;
  text-align: center;
}

.free-mem .mem-wrapper {
  display: flex;
  justify-content: center;
  margin-left: 164px;
  margin-right: 164px;

}

.free-mem .mem-wrapper img {
  width: 43px;
  height: 35px;
  margin-left: auto;
  margin-right: auto;
}

.free-mem button {
  display: block;
  margin-top: 85px;
  margin-bottom: 52px;
  margin-left: auto;
  margin-right: auto;
  border-radius: 22px;
  font-size: 14px;
  height: 44px;
  width: 162px;
  background-color: #C271FF;
  color: white;
  border: 0;
  box-shadow: 0px 2px 20px 0px rgb(0, 0, 0, 0.50);
}

.thumbnail_mk2 {
  position: relative;
  width: 257px;
  height: 153px;
  padding-left: 27px;
  padding-right: 27px;
}

.faq_h1 {
  display: block;
  text-align: center;
  margin-top: 67px;
  font-size: 60px;
  font-weight: 300;
}

.faq {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin-left: 286px;
  margin-right: 271px;
  margin-bottom: 84px;
}

.faq_wrap {
  display: flex;
  justify-content: space-between;

}

.faq_wrap div {
  margin-left: 110px;
  margin-right: 110px;
}

.faq_wrap h2 {
  font-size: 16px;
  font-weight: 700;
  margin-top: 74px;
}

.faq_wrap p {
  text-align: left;
  font-size: 14px;
  line-height: 24px;
  font-weight: 400;
  width: 350px;
  margin-bottom: 74px;
  opacity: 50.16%;
}

.faq_wrap .bottom_half {
  margin-bottom: 84px;
}

footer {
  background-color: #071629;
  height: 249px;
}

.foot_back {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center
}

.foot_nav {
  display: flex;
  flex-direction: row;
  justify-content: center;
  width: 1103px;
  margin-top: 101px;
  margin-left: auto;
  margin-right: auto;
}

.foot_nav .socials {
  padding-left: 736px;
}

#trademark {
  position: absolute;
  color: #FFF;
  text-align: center;
  opacity: 0.3517;
  font-size: 12px;
  font-weight: 400px;
  top: 4000px;
}