/*

Glendale Designs Custom Programming
for {{ENTER DOMAIN NAME}}
Ticket: {{ENTER TEAMWORK TICKET NUMBER}}
Allowed Domains: {{ENTER ALLOWED DOMAIN NAMES}}
	

GD Dialog

Copyright Glendale Designs - Our optimizations are not freeware.
Do not use, copy or distribute without written permission. 
Ask us, we're nice! support@glendaledesigns.com

TERMS OF SERVICE
https://glendaledesigns.com/terms-of-service/
(Make sure to read and understand this section 'Non-Exclusive License to Customer')
	

GDPM - v01.00.01

*/

/* Global Styles */

:host {
	--image-height: 400px; /* Updates in JS file */
}

* {
	box-sizing: border-box;
}

img {
	max-width: 100%;
}

figure {
	margin: 0;
}

picture {
	display: inline-block;
}

a {
	color: inherit;
}

h1, h2, h3, h4, h5, h6 {
	margin: 0;
}

.u-font-small {
	font-size: smaller;
}
.hide-visually {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
}

.gd-feature-list.is-ready {
	opacity: 1 !important;
}

.gd-feature-list__heading {
	text-align: var(--heading-text-align);
	margin-bottom: 1rem;
}
@media screen and (min-width: 60em) {
	.gd-feature-list__heading {
		margin-right: calc(3 * 56px);
	}	
}

/* splide styles for this are also global in the theme but this is in a shadow root so.... */

.gd-feature-list__layout .splide__pagination {
	position: relative;
	left: unset;
	top: unset;
	right: unset;
	bottom: unset;
	margin:0.75rem auto;
	padding: 0 1rem;
}

.gd-feature-list__layout .splide__pagination .splide__pagination__page {
	background: #BCC0CC;
	border: 11px solid #fff;
	border-radius: 50%;
	display: inline-block;
	height: 32px;
	width: 32px;
	opacity: 1;
	margin: 0;
	padding: 0;
}

.gd-feature-list__layout .splide__pagination .splide__pagination__page.is-active {
	background: #2C5CC5;
	transform: none;
	opacity: 1;
	z-index: 1;
}
.gd-feature-list__layout .splide__arrows {
	position: relative;
	top: -3rem;
}
.gd-feature-list__layout .splide__arrow {
	background-color: white;
	border: 1px solid #DADDE7;
	border-radius: 4px;
	color: #4E5361;
	width: 56px;
	height: 56px;
	font-size: 22px;
	opacity: 1;
	padding: 0;
	margin: 0;
	display: inline-flex;
	justify-content: center;
	align-items: center;
	transition-duration: 250ms;
	&:hover:not(:disabled) {
		background-color: var(--blue-500);
		border-color: var(--blue-400);
		color: var(--white);
		opacity: 1;
	}
	&:disabled {
		opacity: 0.25;
		cursor: not-allowed;
	}
	svg {
		display: none;
		fill: none;
		height: inherit;
		width: inherit;
		transform: none;
	}
}
.gd-feature-list__layout .splide__arrow.splide__arrow--prev {
	left: unset;
	right: calc(56px + 1rem);
}
.gd-feature-list__layout .splide__arrow.splide__arrow--next {
	right: 0;
}



/* Grid */
.gd-feature-list__card-figure {
	margin-bottom: 1.75rem;
}
.gd-feature-list__grid {
	display: grid;
	grid-template-columns: repeat(1, 1fr);
	gap: 1rem;
}
@media screen and (min-width: 30em) {
	.gd-feature-list__grid {
		grid-template-columns: repeat(2, 1fr);
	}
}
@media screen and (min-width: 48em) {
	.gd-feature-list__grid {
		grid-template-columns: repeat(3, 1fr);
	}
}
@media screen and (min-width: 60em) {
	.gd-feature-list__card-figure {
		margin-bottom: 0;
	}	
	.gd-feature-list__grid {
		grid-template-columns: repeat(var(--column-count, auto-fill), 1fr);
		gap: 2rem;
	}
}
@media screen and (min-width: 75em) {
	.gd-feature-list__grid {
		gap: 40px;
	}
}

/* Card */
.gd-feature-list__card {
	height: 100%;

	& .gd-feature-list__card-text {
		margin-top: 1rem;
	}

	& > .gd-feature-list__card-text:first-child, & > a > .gd-feature-list__card-text:first-child {
		margin-top: 0;
	}
}

.gd-feature-list__card-link {
	text-decoration: none;
}

.gd-feature-list__card-image {
	display: flex;
	width: 100%;
}

.gd-feature-list__card-image img {
	width: 100%;
	object-fit: var(--image-fit, cover);
}

.gd-feature-list__card-text {
	text-align: var(--card-text-align, left);
}

.gd-feature-list__card-body {
	text-decoration: none;
}
.gd-feature-list__card-overlay {
	position: absolute;
	top: 260px;
	left: 1rem;
	font-size: 0.75rem;
	background: var(--white);
	color: var(--blue-400);
	border: 1px solid var(--blue-400);
	cursor: default;
	line-height: 1.5;
	padding: 0.5em 1em;
}

/* Closeup */
.gd-feature-list__closeup {
	border: none;
	padding: 0;
	background: none;
	margin: 0;
	height: 100%;
	width: 100%;
	max-width: 100%;
	max-height: 100%;
	padding-bottom: 1rem;

	&::backdrop {
		background-color: rgba(0, 0, 0, 0.45);
	}
}

.gd-feature-list__card-open-closeup {
	background: none;
	border: none;
	padding: 0;
	cursor: pointer;
	display: block;
	width: 100%;
}

.gd-feature-list__closeup-close {
	background-color: white;
	border: 1px solid #ddd;
	color: #111;
	width: 45px;
	height: 45px;
	opacity: 1;
	padding: 0.65rem;
	border-radius: 50%;

	&:hover {
		box-shadow: 0 0 38px rgba(0, 0, 0, 0.21);
	}
}

.gd-feature-list__closeup-inner {

}

.gd-feature-list__closeup-slider {
	height: 100%;
	display: flex;
	flex-direction: column;
	gap: 1rem;
	justify-content: center;
	position: relative;
}

.gd-feature-list__closeup-item {
}

.gd-feature-list__closeup-figure {
	height: 100%;
	display: flex;
	justify-content: center;
	margin-top: 2rem;
}

.gd-feature-list__closeup-image {
	height: 100%;
}

.gd-feature-list__closeup-image img {
	overflow: hidden;
	max-width: 90vw;
	max-height: 86vh;
	object-fit: contain;
	cursor: zoom-in;
	transition: transform 0.3s ease;
	transform-origin: center center;
	will-change: transform;
}

.gd-feature-list__closeup-image img.is-zoomed {
	cursor: zoom-out;
	transform: scale(2.5);
}

.gd-feature-list__closeup .splide__arrows {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 1rem;
	position: absolute;
	bottom: 1rem;
	left: 0;
	right: 0;
}

.gd-feature-list__closeup .splide__arrow {
	position: static;
	transform: none;
}

.gd-feature-list__closeup-close {
	cursor: pointer;
}

/* ==========================================================================
	 UTILITIES / ICONS
	 ========================================================================== */
/**
 * This contains the "@font-face" call needed to add the ReadyTheme Icons Font
 * package to your site.
 */
@font-face {
	font-display: block;
	font-family: "ReadyTheme Icons";
	font-style: normal;
	font-weight: normal;
	src: url("/mm5/gd-build-assets/for-theme/fonts/ReadyThemeIcons.woff") format("woff");
}

[class^=u-icon-],
[class*=" u-icon-"],
[data-icon]::before {
	font-family: "ReadyTheme Icons", sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-variant: normal;
	font-weight: normal;
	line-height: 1;
	speak: none;
	text-transform: none;
}

[data-icon]::before {
	content: attr(data-icon);
}

[class^=u-icon-]::before,
[class*=" u-icon-"]::before,
[data-icon]::before {
	background-color: rgba(0, 0, 0, 0);
}

.u-icon-add::before {
	content: "=";
}

.u-icon-add-circle::before {
	content: "\e901";
}

.u-icon-alert::before {
	content: "\e902";
}

.u-icon-arrow-down::before {
	content: "9";
}

.u-icon-arrow-left::before {
	content: ":";
}

.u-icon-arrow-right::before {
	content: ";";
}

.u-icon-arrow-up::before {
	content: "8";
}

.u-icon-bag::before {
	content: "X";
}

.u-icon-bag-full::before {
	content: "Y";
}

.u-icon-balance::before {
	content: "-";
}

.u-icon-calendar::before {
	content: "W";
}

.u-icon-cart-add::before {
	content: "/";
}

.u-icon-cart-empty::before {
	content: "Z";
}

.u-icon-cart-full::before {
	content: "[";
}

.u-icon-check::before {
	content: "?";
}

.u-icon-chevron-down::before {
	content: "1";
}

.u-icon-chevron-left::before {
	content: "2";
}

.u-icon-chevron-right::before {
	content: "3";
}

.u-icon-chevron-up::before {
	content: "0";
}

.u-icon-contact::before {
	content: "\e913";
}

.u-icon-credit-card::before {
	content: "C";
}

.u-icon-cross::before {
	content: ">";
}

.u-icon-customer-credit::before {
	content: "\e916";
}

.u-icon-document::before {
	content: "U";
}

.u-icon-edit::before {
	content: "\e918";
}

.u-icon-envelope::before {
	content: ")";
}

.u-icon-error::before {
	content: "!";
}

.u-icon-exit-circle::before {
	content: "\e91b";
}

.u-icon-eye-closed::before {
	content: "\e91c";
}

.u-icon-eye-open::before {
	content: "\e91d";
}

.u-icon-filter::before {
	content: "\e91e";
}

.u-icon-flag-empty::before {
	content: "\e91f";
}

.u-icon-flag-full::before {
	content: "\e920";
}

.u-icon-gift::before {
	content: "%";
}

.u-icon-globe::before {
	content: "+";
}

.u-icon-heart-empty::before {
	content: "D";
}

.u-icon-heart-full::before {
	content: "E";
}

.u-icon-heart-half::before {
	content: "\e925";
}

.u-icon-history::before {
	content: ",";
}

.u-icon-home::before {
	content: "H";
}

.u-icon-info::before {
	content: "$";
}

.u-icon-location::before {
	content: "\\";
}

.u-icon-lock::before {
	content: "\e92a";
}

.u-icon-menu::before {
	content: "V";
}

.u-icon-minus-circle::before {
	content: "\e92c";
}

.u-icon-phone::before {
	content: "J";
}

.u-icon-play::before {
	content: "\e92e";
}

.u-icon-print::before {
	content: "S";
}

.u-icon-question::before {
	content: "#";
}

.u-icon-remove::before {
	content: ".";
}

.u-icon-search::before {
	content: "B";
}

.u-icon-secure::before {
	content: "(";
}

.u-icon-settings::before {
	content: "&";
}

.u-icon-shield::before {
	content: "'";
}

.u-icon-sign-out::before {
	content: "\e936";
}

.u-icon-star-empty::before {
	content: "F";
}

.u-icon-star-full::before {
	content: "G";
}

.u-icon-star-half::before {
	content: "\e939";
}

.u-icon-subtract::before {
	content: "<";
}

.u-icon-talk::before {
	content: "\e93b";
}

.u-icon-triangle-down::before {
	content: "5";
}

.u-icon-triangle-left::before {
	content: "6";
}

.u-icon-triangle-right::before {
	content: "7";
}

.u-icon-triangle-up::before {
	content: "4";
}

.u-icon-truck::before {
	content: "*";
}

.u-icon-user::before {
	content: "I";
}

.u-icon-wallet::before {
	content: "T";
}

.u-icon-warning::before {
	content: "\"";
}

.u-icon-zoom-in::before {
	content: "A";
}

.u-icon-zoom-out::before {
	content: "@";
}

.u-icon-facebook::before {
	content: "K";
}

.u-icon-instagram::before {
	content: "O";
}

.u-icon-linkedin::before {
	content: "N";
}

.u-icon-pinterest::before {
	content: "M";
}

.u-icon-twitter::before {
	content: "L";
}

.u-icon-youtube::before {
	content: "P";
}

@media speech {
	[class^=u-icon-]::before,
	[class*=" u-icon-"]::before,
	[data-icon]::before {
		content: none;
		display: none;
		visibility: hidden;
	}
}