.blockquote.left {
  position: relative;
  margin: 60rem 0;
  padding: 100rem 250rem 100rem 0;
}
.blockquote.right {
  position: relative;
  margin: 60rem 0;
  padding: 100rem 0 100rem 250rem;
}
.blockquote blockquote {
  background-color: transparent;
  position: relative;
	margin: 0 0 30rem 0;
	border-radius: 10rem;
  font-size: 20rem;
  font-weight: 500;
  letter-spacing: 0;
  line-height: 30rem;
}
.blockquote blockquote .content {
  position: relative;
  width: 100%;
}
.blockquote blockquote .content p {
  margin: 0;
}
.blockquote blockquote .large-quotes {
	background: url(images/ui-large-quotes.webp) no-repeat center / 100%;
  height: 145px;
  width: 145px;
  position: absolute;
  top: 0;
  right: 0;
  transform: translate3d(60%, -40px, 0);
}


.blockquote.left .background {
  background: #F7F5F2;
  position: absolute;
  top: 0;
  height: 100%;
  width: 100%;
  margin-left: calc(50% - 50vw);
  padding-right: calc(-50% + 50vw);
  border-top-right-radius: 409px;
  border-bottom-right-radius: 409px;
  pointer-events: none;
}
.blockquote.right .background {
  background: #F7F5F2;
  position: absolute;
  top: 0;
  height: 100%;
  width: 100%;
  margin-right: calc(50% - 50vw);
  padding-left: calc(-50% + 50vw);
  border-top-left-radius: 409px;
  border-bottom-left-radius: 409px;
  pointer-events: none;
}
.blockquote .author-details {
  position: relative;
  display: flex;
  align-items: center;
  margin-top: 20rem;
}
.blockquote.right .author-details ,
.blockquote.right blockquote {
margin-left: 100rem;
}
.blockquote .author-details .image {
  width: 64px;
  height: 64px;
  margin-right: 20px;
}
.blockquote .author-details .image img {
  border-radius: 50%;
  object-fit: contain;
  object-position: center;
}

.blockquote .author-details .content h5{
  font-size: 24rem;
  /* font-family: 'Lora', serif; */
  font-family: "Outfit", sans-serif;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-transform: capitalize;
  margin: 0;
}
.blockquote .author-details .content p{
  opacity: 0.5;
  font-size: 16rem;
  font-weight: 700;
  margin: 0;
}

@media screen and (max-width: 960px) {
  .blockquote.left,
  .blockquote.right {
    padding: 200rem 0 100rem 0;
}
.blockquote.right blockquote {
  margin: 0 20rem;
}
.blockquote.right .author-details {
  margin: 20rem;
}

  .blockquote.left .background,
  .blockquote.right .background {
    padding: 0;
    margin: 0;
    border-top-right-radius: 409px;
    border-top-left-radius: 409px;
    transform: scaleX(1.2);
    border-bottom-right-radius: 0;
}
.blockquote blockquote .large-quotes {
	background: url(images/ui-large-quotes.webp) no-repeat center / 100%;
  height: 145px;
  width: 145px;
  position: absolute;
  top: 0;
  right: 0;
  transform: translate3d(0, -60%, 0);
}
}