/* =========================================================
   TESTIMONIAL / REVIEW CSS
========================================================= */

.textMain .reviewsList {
	position: relative;
	padding: 20px 0px;
}
.textMain .reviewsList ul {
	margin: 0px;
	padding: 0px;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 10px;
	justify-content: center;
}
.textMain .reviewsList li {
	margin: 0px;
	padding: 0px;
	background: none;
	font: 400 16px/20px var(--siteFont);
	position: relative;
}
.textMain .reviewsList a {
	display: block;
	padding: 10px 25px;
	text-decoration: none;
	color: var(--themeOneBg);
	border-radius: 40px;
	border: 2px solid rgba(0, 0, 0, 0.1);
}
.textMain .reviewActive a {
	background: var(--themeOneBg);
	color: var(--fontLight);
}
/*


.textMain .reviewList a::before {
    margin-right: 10px;
}

.textMain .reviewList>ul>li {
    background: none;
    position: relative;
    text-align: left;
    margin: 30px 1%;
    padding: 15px;
    -webkit-box-shadow: inset 0 0 5px 1px rgba(51, 51, 51, 0.2);
    -moz-box-shadow: inset 0 0 5px 1px rgba(51, 51, 51, 0.2);
    -ms-box-shadow: inset 0 0 5px 1px rgba(51, 51, 51, 0.2);
    -o-box-shadow: inset 0 0 5px 1px rgba(51, 51, 51, 0.2);
    box-shadow: inset 0 0 5px 1px rgba(51, 51, 51, 0.2);
}
.textMain .reviewList>ul>li::before {
    border-top: 3px solid #ccc;
    border-left: 3px solid #ccc;
    top: -10px;
    left: -10px;
}
.textMain .reviewList>ul>li::before,
.textMain .reviewList>ul>li::after {
    position: absolute;
    content: '';
    width: 35px;
    height: 35px;
}
.textMain .reviewList>ul>li::after {
    border-right: 3px solid #ccc;
    border-bottom: 3px solid #ccc;
    right: -10px;
    bottom: -10px;
}
*/

.bg-icon::before {
	content: '';
	position: relative;
	width: 37px;
	height: 20px;
	display: inline-block;
	vertical-align: middle;
	margin-top: -4px;
}
.textMain .googleReview a::before {
	background: url(/new-images/google-review.png) no-repeat center center;
}
.textMain .healthReview a::before {
	background: url(/new-images/healthgrade-review.png) no-repeat center center;
}
/* =========================================================
   REVIEW MAIN
========================================================= */

.reviewMain, .textMain .reviewList {
	position: relative;
	padding: 20px 0;
}
.rating {
	margin-bottom: 20px;
}
/* =========================================================
   REVIEW GRID
========================================================= */

.textMain .reviewMain > ul,
.textMain .reviewList .Slider1 {
	margin: 0;
	padding: 0;
	display: block;
	columns: 3;
	column-gap: 20px;
}
/* =========================================================
   REVIEW CARD
========================================================= */
.textMain .reviewMain > ul > li,
.textMain .reviewList > ul > li {
	margin: 0 0 20px;
	padding: 20px;
	background: none;
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 10px;
	font: 400 17px/27px var(--siteFont);
	position: relative;
	overflow: hidden;
	display: inline-flex;
	flex-direction: column;
	width: 100%;
	min-width: 0;
	height: auto;
	box-sizing: border-box;
	break-inside: avoid;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}
/* =========================================================
   REVIEW CARD HOVER
========================================================= */

.textMain .reviewMain > ul > li:hover, .textMain .reviewList > ul > li:hover {
	transform: translateY(-5px);
	box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.1);
}
/* =========================================================
   REVIEW TEXT
   Keep existing typography and spacing
========================================================= */

.textMain .reviewMain > ul > li p, .textMain .reviewList > ul > li p {
	margin-top: 0;
}
/* =========================================================
   READ MORE BUTTON
   Align buttons at the bottom of each card
========================================================= */

/* When the link is a direct child of the card */
.textMain .reviewMain > ul > li > a:last-child, .textMain .reviewList > ul > li > a:last-child {
	margin-top: auto;
	align-self: flex-start;
}
/* When the link is inside a wrapper */
.textMain .reviewMain > ul > li .readMore, .textMain .reviewList > ul > li .readMore {
	margin-top: auto;
	align-self: flex-start;
}
.all-imgs.inner-only ul {
  display: grid;
  grid-template-columns: auto auto auto;
  align-items: center;
  gap:10px;
}
.im-r.img-r-spl.only-one-in img {
	float: left;
	margin: 0px 40px 20px 0px;
	border: 1px solid #e1e1e1;
	padding: 10px;
}
.all-imgs.inner-only ul li {
	padding:0px;
	background:none;
}
/* =========================================================
   RESPONSIVE DESIGN
========================================================= */

@media (max-width: 991px) {
.textMain .reviewMain > ul, .textMain .reviewList > ul {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}
	.textMain .reviewMain > ul,
	.textMain .reviewList .Slider1 {
		columns: 2;
	}
}
 @media (max-width: 600px) {
.textMain .reviewMain > ul, .textMain .reviewList > ul {
	grid-template-columns: 1fr;
}
.textMain .reviewMain > ul > li, .textMain .reviewList > ul > li {
	min-height: 300px;
}
}

@media (max-width: 575px) {
	.textMain .reviewMain > ul,
	.textMain .reviewList .Slider1 {
		columns: 1;
	}
}
/* =========================================================
   REVIEW CONTENT
========================================================= */

.reviewDiv {
	padding: 20px;
	/*
     * Important:
     * This makes the content area fill
     * the remaining card height.
     */
	flex: 1;
	display: flex;
	flex-direction: column;
}
/* =========================================================
   QUOTE ICON
========================================================= */

.reviewDiv::before {
	content: '\f10d';
	position: relative;
	color: var(--themeOneBg);
	font: 400 30px/30px 'fontello';
	padding-bottom: 10px;
	display: block;
}
/* =========================================================
   REVIEW MORE
   Stars + Source
========================================================= */

.reviewMore {
	/*
     * Push stars/source to the bottom
     */
	margin-top: auto;
	padding: 10px 0px 0px 0px;
	font: 400 16px/20px var(--siteFont);
	text-align: right;
}
/* =========================================================
   STARS + SOURCE ROW
========================================================= */

.textMain .reviewMore ul {
	margin: 0px;
	padding: 0px;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
}
/* =========================================================
   REVIEW MORE LIST ITEMS
========================================================= */

.textMain .reviewMore li {
	margin: 0px;
	padding: 0px;
	background: none;
	list-style: none;
}
.Slider1 > li .revMore {
	margin: 22px 0 0;
	padding: 0;
}
.Slider1 > li .revMore a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	width: auto;
	margin: 0;
	padding: 12px 20px;
	border: 1px solid #ddd9d0;
	border-radius: 20px;
	background: transparent;
	font-size: 11px;
	line-height: 1;
	font-weight: 600;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #4d554f;
	text-decoration: none;
}
.Slider1 > li .revMore a::after {
	content: "→";
	font-size: 16px;
	line-height: 1;
}
.patientReview .font-icon::before, .writeReview .font-icon::before, .videoReview .font-icon::before, .raterReview .font-icon::before {
	margin-right: 10px;
}
/* =========================================================
   STARS
========================================================= */

.stars {
	margin: 5px 0px;
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	gap: 5px;
	align-items: center;
}
/* =========================================================
   REVIEW SOURCE
========================================================= */

.textMain .rSource {
	margin-left: auto;
	font: 600 italic 16px/20px var(--siteFont);
	white-space: nowrap;
}
/* =========================================================
   RATING DISPLAY
========================================================= */

.rating-display {
	color: var(--themeOneBg);
	font: 400 16px/26px var(--siteFont);
	text-align: center;
	display: none;
	margin: 0px auto;
}
/* =========================================================
   REVIEWER NAME
========================================================= */

.reviewName {
	margin-top: auto;
	font-style: italic;
	text-align: center;
	background: var(--themeOneBg);
	color: var(--fontLight);
	padding: 15px;
}
/* =========================================================
   READ MORE
========================================================= */

.textMain li.rMore a {
	display: inline-block;
	vertical-align: top;
	margin: 0px;
	padding: 10px 20px;
	border: 2px solid rgba(0, 0, 0, 0.1);
	border-radius: 40px;
}
.textMain li.rMore a:hover {
	text-decoration: none;
	background: var(--themeOneBg);
	color: var(--fontLight);
}
.revName {
	font-style: italic;
	text-align: right;
}
.textMain .galleries ul {
	margin: 0px;
	padding: 0px;
}
.textMain .galleries li {
	margin: 3px;
	padding: 0px;
	display: inline-block;
	vertical-align: top;
}
.textMain .galleries li img {
	border: 2px solid var(--fontDark);
	padding: 2px;
}
.stars {
	margin: 5px;
	text-align: center;
	display: inline-block;
	vertical-align: top;
}
.rating-display {
	color: #9f9fa2;
	font: 400 16px/26px 'Open Sans', sans-serif;
	text-align: center;
	display: none;
	margin: 0px auto;
}
svg .star1 {
	fill: var(--themeOneBg) !important;
	stroke: var(--themeTwoBg) !important;
}
svg .star1_stroke {
	fill: var(--themeOneBg) !important;
	stroke: var(--themeTwoBg) !important;
}
svg .star4 {
	fill: var(--themeOneBg) !important;
	stroke: var(--themeTwoBg) !important;
}
svg .star4_stroke {
	stroke: #fff !important;
}
.dfw-whitemode svg .star1 {
	fill: #00e !important;
	stroke: #00e !important;
}
.dfw-whitemode svg .star1_stroke {
	fill: #00e !important;
	stroke: #00e !important;
}
.dfw-whitemode svg .star4_stroke {
	stroke: #00e !important;
}
.dfw-blackmode svg .star1 {
	fill: #fc0 !important;
	stroke: #fc0 !important;
}
.dfw-blackmode svg .star1_stroke {
	fill: #fc0 !important;
	stroke: #fc0 !important;
}
.dfw-blackmode svg .star4_stroke {
	stroke: #fc0 !important;
}
.dfw-greymode svg .star1 {
	fill: #000 !important;
	stroke: #000 !important;
}
.dfw-greymode svg .star1_stroke {
	fill: #000 !important;
	stroke: #000 !important;
}
.dfw-greymode svg .star4_stroke {
	stroke: #000 !important;
}
/* =========================================================
   ACCESSIBILITY
========================================================= */

html[data-theme='dark'] .accessible_on .textMain .reviewList > ul > li {
	box-shadow: inset 0 5px 5px 2px rgba(255, 255, 255, 0.5);
}
.accessible_on svg .star1 {
	fill: var(--linkColor) !important;
	stroke: var(--linkColor) !important;
}
.accessible_on svg .star1_stroke {
	fill: var(--linkColor) !important;
	stroke: var(--linkColor) !important;
}
.accessible_on svg .star4_stroke {
	stroke: var(--linkColor) !important;
}


/* =========================================================
   RESPONSIVE - TABLET
========================================================= */

@media only screen and (max-width: 991px) {
.textMain .reviewMain > ul {
	grid-template-columns: repeat(2, 1fr);
}
}


/* =========================================================
   RESPONSIVE - MOBILE
========================================================= */

@media only screen and (max-width: 600px) {
.textMain .reviewMain > ul {
	grid-template-columns: 1fr;
}
.textMain .reviewMain > ul > li {
	min-height: auto;
}
.textMain .reviewMore ul {
	flex-wrap: wrap;
}
}