/*!******************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!./src/custom-elements/square-video-thumbnail/style.scss ***!
  \******************************************************************************************************************************************************************************************************************************************************************************/
.wp-block-create-block-square-video-thumbnail.patient-story {
  width: 100%;
  max-width: 840px;
  display: block;
  overflow: hidden;
  background-size: 60% auto;
  background-repeat: no-repeat;
  background-position: 120% 100%;
  border: 1px solid #D9D9D9;
  background-color: #FFFFFF;
  box-shadow: 0px 10px 20px 0px rgba(16, 24, 40, 0.25);
  position: relative;
  cursor: pointer;
  text-decoration: none !important;
  transition: all ease 250ms;
  aspect-ratio: 1;
  padding: 40px;
  border-radius: 8px;
  margin: auto;
}
@media (min-width: 768px) and (max-width: 1399.98px) {
  .wp-block-create-block-square-video-thumbnail.patient-story .large-heading {
    font-size: 40px;
    line-height: 43px;
    letter-spacing: unset;
  }
}
@media all and (max-width: 989.98px) {
  .wp-block-create-block-square-video-thumbnail.patient-story {
    order: 2;
    max-width: 500px;
    margin: auto;
    aspect-ratio: unset;
  }
  .wp-block-create-block-square-video-thumbnail.patient-story .large-heading {
    padding-bottom: 100px;
  }
}
.wp-block-create-block-square-video-thumbnail.patient-story .shaped-container {
  width: 75%;
  transform: skew(-40deg);
}
.wp-block-create-block-square-video-thumbnail.patient-story .shaped-container * {
  transform: skew(40deg);
}
.wp-block-create-block-square-video-thumbnail.patient-story .watch-cta-box {
  opacity: 0;
  transition: all ease 250ms;
  background-color: #000000;
  border-radius: 10px;
  width: 50%;
  position: absolute;
  bottom: 35px;
  left: 25px;
  padding: 20px;
}
.wp-block-create-block-square-video-thumbnail.patient-story .watch-cta-box p {
  color: #FFFFFF;
  margin-bottom: 10px;
}
.wp-block-create-block-square-video-thumbnail.patient-story .watch-cta-box p:last-of-type {
  margin-bottom: 0;
}
.wp-block-create-block-square-video-thumbnail.patient-story:hover .watch-cta-box, .wp-block-create-block-square-video-thumbnail.patient-story:focus .watch-cta-box {
  opacity: 1;
}
.wp-block-create-block-square-video-thumbnail.patient-story::before {
  content: "";
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  width: 80px;
  height: 80px;
  bottom: 35px;
  left: 35px;
  position: absolute;
  transition: all ease 250ms;
  background-image: url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2780%27 height=%2780%27 viewBox=%270 0 80 80%27 fill=%27none%27%3E%3Cpath d=%27M55.049 39.9997L29.3591 51.2062L29.3591 28.7932L55.049 39.9997Z%27 fill=%27black%27 stroke=%27black%27 stroke-width=%273%27 stroke-linejoin=%27round%27/%3E%3Ccircle cx=%2740%27 cy=%2740%27 r=%2738.5%27 stroke=%27black%27 stroke-width=%273%27/%3E%3C/svg%3E");
}
.wp-block-create-block-square-video-thumbnail.patient-story:hover, .wp-block-create-block-square-video-thumbnail.patient-story:focus {
  color: #000000 !important;
  border-color: #000000;
}
.wp-block-create-block-square-video-thumbnail.patient-story:hover::before, .wp-block-create-block-square-video-thumbnail.patient-story:focus::before {
  background-image: url("data:image/svg+xml,%3C%3Fxml version=%271.0%27 encoding=%27UTF-8%27%3F%3E%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 version=%271.1%27 viewBox=%270 0 40 40%27%3E%3Cdefs%3E%3Cstyle%3E .cls-1 %7B fill: %23fff; stroke: %23fff; stroke-linejoin: round; %7D .cls-1, .cls-2 %7B stroke-width: 2px; %7D .cls-2 %7B stroke: %23000; %7D %3C/style%3E%3C/defs%3E%3C%21-- Generator: Adobe Illustrator 28.7.1, SVG Export Plug-In . SVG Version: 1.2.0 Build 142%29 --%3E%3Cg%3E%3Cg id=%27Layer_1%27%3E%3Cg id=%27Group_815%27%3E%3Ccircle id=%27Ellipse_1%27 class=%27cls-2%27 cx=%2720%27 cy=%2720%27 r=%2719%27/%3E%3Cpath id=%27Polygon_4%27 class=%27cls-1%27 d=%27M27.5,20l-12.8,5.6v-11.2l12.8,5.6Z%27/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
.wp-block-create-block-square-video-thumbnail.patient-story .watch-cta-box {
  opacity: 0;
  transition: all ease 250ms;
  background-color: #000000;
  border-radius: 10px;
  position: absolute;
  bottom: 20px;
  left: 20px;
  right: 20px;
  padding: 20px;
}
.wp-block-create-block-square-video-thumbnail.patient-story .watch-cta-box p {
  color: #FFFFFF;
  margin-bottom: 10px;
}
.wp-block-create-block-square-video-thumbnail.patient-story .watch-cta-box p:last-of-type {
  margin-bottom: 0;
}
.wp-block-create-block-square-video-thumbnail.patient-story p {
  margin: 0;
}
.wp-block-create-block-square-video-thumbnail.patient-story .eyebrow {
  color: #000000;
}
.wp-block-create-block-square-video-thumbnail.patient-story:hover .watch-cta-box, .wp-block-create-block-square-video-thumbnail.patient-story:focus .watch-cta-box {
  opacity: 1;
}

/*# sourceMappingURL=style-index.css.map*/