:root:is(html) {
	
	--bdr-stl: solid; /* { friendly: 'Border Style', group: 'Borders' } */
	--bdr-w: 1px; /* { min: 1, max: 4, step: 1, friendly: 'Border Width', group: 'Borders' } */
	--bdr-clr-o: 0.3; /* { min: 0.05,  max: 1, step: 0.05, friendly: 'Border Opacity', group: 'Borders' } */
	--bg-bx-o: 1;  /* { min: .2, max: 1, step: 0.05, friendly: 'Like/Unlike Box Opacity', group: 'Calculations' } */
	
	--img-fg-sat: 1; /* { min: 0, max: 1, step: 0.1, friendly: 'Saturation - Foreground Imagery', group: 'Images' } */
	--img-fg-sep: 0; /* { min: 0, max: 1, step: 0.1, friendly: 'Sepia - Foreground Imagery', group: 'Images' } */
	--img-fg-brt: 1; /* { min: 0, max: 1.5, step: 0.1, friendly: 'Brightness - Foreground Imagery', group: 'Images' } */
	--img-fg-con: 1; /* { min: 0, max: 1.5, step: 0.1, friendly: 'Contrast - Foreground Imagery', group: 'Images' } */
	--img-fg-blr: 0px; /* { min: 0, max: 10, step: .1, friendly: 'Blur - Foreground Imagery', group: 'Images' } */
	--img-fg-o: 1; /* { min: .2, max: 1, step: 0.05, friendly: 'Opacity - Foreground Imagery', group: 'Images' } */
	
	--img-bg-o: 1; /* { min: .2, max: 1, step: 0.05, friendly: 'Opacity - Background Imagery', group: 'Images' } */
	--img-bg-sat: 1; /* { min: 0, max: 1, step: 0.1, friendly: 'Saturation - Background Imagery', group: 'Images' } */
	--img-bg-sep: 0; /* { min: 0, max: 1, step: 0.1, friendly: 'Sepia - Background Imagery', group: 'Images' } */
	--img-bg-brt: 1; /* { min: 0, max: 1.5, step: 0.1, friendly: 'Brightness - Background Imagery', group: 'Images' } */
	--img-bg-con: 1; /* { min: 0, max: 1.5, step: 0.1, friendly: 'Contrast - Background Imagery', group: 'Images' } */
	--img-bg-blr: 0px; /* { min: 0, max: 10, step: .1, friendly: 'Blur - Background Imagery', group: 'Images' } */
	
	--vid-bg-o: 1; /* { min: .2, max: 1, step: 0.05, friendly: 'Video Background Opacity', group: 'Calculations' } */
	
	--btn-txt-clr: var(--text-alt); /* { friendly: 'Button Text Color - Main', group: 'Colors' } */
	
	--btn-txt-clr-lt: var(--text); /* { friendly: 'Light Theme, Inner Theme Alt - Button V1 Text Color', group: 'Colors' } */
	--btn-bg-clr-lt: var(--inner-bg); /* { friendly: 'Light Theme, Inner Theme Alt - Button V1 Color', group: 'Colors' } */
	--btn-txt-clr-lt-alt: var(--text-alt); /* { friendly: 'Light Theme, Inner Theme Alt - Button V1 Alt Text Color', group: 'Colors' } */
	--btn-bg-clr-lt-alt: var(--main-bg-alt); /* { friendly: 'Light Theme, Inner Theme Alt - Button V1 Alt Color', group: 'Colors' } */
	
	--btn-txt-clr-dk: var(--text-alt); /* { friendly: 'Dark Theme, Inner Theme Alt - Button V1 Text Color', group: 'Colors' } */
	--btn-bg-clr-dk: var(--buttons); /* { friendly: 'Dark Theme, Inner Theme Alt - Button V1 Color', group: 'Colors' } */
	--btn-txt-clr-dk-alt: var(--text-alt); /* { friendly: 'Dark Theme, Inner Theme Alt - Button V1 Alt Text Color', group: 'Colors' } */
	--btn-bg-clr-dk-alt: var(--main-bg-alt); /* { friendly: 'Dark Theme, Inner Theme Alt - Button V1 Alt Color', group: 'Colors' } */
	
	--bx-sdw-dsk-x: 0.1em; /* { min: 0,  max: 4, step: 0.1, friendly: 'Desktop Only Box Shadow \'X\' Position', group: 'Box Shadow' } */
	--bx-sdw-dsk-y: 0.1em; /* { min: 0,  max: 4, step: 0.1, friendly: 'Desktop Only Box Shadow \'Y\' Position', group: 'Box Shadow' } */
	--bx-sdw-dsk-blr: 0.1em; /* { min: 0,  max: 4, step: 0.1, friendly: 'Desktop Only Box Shadow Blur', group: 'Box Shadow' } */
	--bx-sdw-dsk-o: 0; /* { min: 0,  max: 1, step: 0.05, friendly: 'Desktop Only Box Shadow Opacity', group: 'Box Shadow' } */
	
	--bx-sdw-x: 0.1em; /* { min: 0,  max: 4, step: 0.1, friendly: 'Box Shadow \'X\' Position', group: 'Box Shadow' } */
	--bx-sdw-y: 0.1em; /* { min: 0,  max: 4, step: 0.1, friendly: 'Box Shadow \'Y\' Position', group: 'Box Shadow' } */
	--bx-sdw-blr: 0.5em; /* { min: 0,  max: 4, step: 0.1, friendly: 'Box Shadow Blur', group: 'Box Shadow' } */
	--bx-sdw-o: 0; /* { min: 0,  max: 1, step: 0.05, friendly: 'Box Shadow Opacity', group: 'Box Shadow' } */
	
	--bx-sdw-crd-x: 0.2em; /* { min: 0,  max: 4, step: 0.1, friendly: 'Card Box Shadow \'X\' Position', group: 'Box Shadow' } */
	--bx-sdw-crd-y: 0.2em; /* { min: 0,  max: 4, step: 0.1, friendly: 'Card Box Shadow \'Y\' Position', group: 'Box Shadow' } */
	--bx-sdw-crd-blr: 0.5em; /* { min: 0,  max: 4, step: 0.1, friendly: 'Card Box Shadow Blur', group: 'Box Shadow' } */
	--bx-sdw-crd-o: 0; /* { min: 0,  max: 1, step: 0.05, friendly: 'Card Box Shadow Opacity', group: 'Box Shadow' } */
	
	--bg-bx-o: 0.9; /* { min: 0,  max: 1, step: 0.05, friendly: 'BG Box Opacity' } */
	
	--bdr-rds: 0.333rem; /* { min: 0,  max: 5, step: 0.001, friendly: 'Border Radius', group: 'Calculations' } */
    --bdr-bl-rds: 1; /* { min: 0,  max: 1, step: 0.25, friendly: 'Border Radius - Bottom Left Corner', group: 'Calculations' } */
    --bdr-br-rds: 1; /* { min: 0,  max: 1, step: 0.25, friendly: 'Border Radius - Bottom Right Corner', group: 'Calculations' } */
    --bdr-tl-rds: 1; /* { min: 0,  max: 1, step: 0.25, friendly: 'Border Radius - Top Left Corner', group: 'Calculations' } */
    --bdr-tr-rds: 1; /* { min: 0,  max: 1, step: 0.25, friendly: 'Border Radius - Top Right Corner', group: 'Calculations' } */
    
    --bdr-rds-crd: 0.333rem; /* { min: 0,  max: 5, step: 0.001, friendly: 'Card Border Radius', group: 'Calculations' } */
    --bdr-bl-rds-crd: 1; /* { min: 0,  max: 1, step: 0.25, friendly: 'Card Border Radius - Bottom Left Corner', group: 'Calculations' } */
    --bdr-br-rds-crd: 1; /* { min: 0,  max: 1, step: 0.25, friendly: 'Card Border Radius - Bottom Right Corner', group: 'Calculations' } */
    --bdr-tl-rds-crd: 1; /* { min: 0,  max: 1, step: 0.25, friendly: 'Card Border Radius - Top Left Corner', group: 'Calculations' } */
    --bdr-tr-rds-crd: 1; /* { min: 0,  max: 1, step: 0.25, friendly: 'Card Border Radius - Top Right Corner', group: 'Calculations' } */
    
	--frm-bdr-stl: solid; /* { friendly: 'Form Input Border Style', group: 'Borders' } */
	--frm-bdr-w: 1px; /* { min: 1, max: 4, step: 1, friendly: 'Form Input Border Width', group: 'Borders' } */
	--frm-bdr-rds: 0.333rem; /* { min: 0,  max: 5, step: 0.001, friendly: 'Form Input Border Radius', group: 'Borders' } */	
	
	--flx-gap: 8.9rem; /* { min: 4, max: 9, step: 0.1, friendly: 'Flex Gap Amount',group: 'Spacing' } */
	
	--fncy-imgs-ovp-a: 2.222rem; /* { min: 1, max: 3, step: 0.1, friendly: 'Fancy Image Overlap Amount' ,group: 'Spacing' } */
	
	--g-cnt-k-ttl-m: 0.8rem; /* { min: 0.2, max: 2, step: 0.05, friendly: 'Kicker + Title Margin', group: 'Spacing' } */
	--g-cnt-ttl-ttl-m: 0.55rem; /* { min: 0.2, max: 1, step: 0.05, friendly: 'Title Margin', group: 'Spacing' } */
	--g-cnt-ttl-cnt-m: 1rem; /* { min: 0.5, max: 1.5, step: 0.05, friendly: 'Content Margin', group: 'Spacing' } */
	--g-cnt-full-img-m: 1.5rem; /* { min: 1, max: 3, step: 0.05, friendly: 'Full Content Image Top/Bottom Margin', group: 'Spacing' } */
	
	--g-trn-sp: .3s; /* { min: 0, max: 1, step: 0.05, friendly: 'Default Transition Speed', group: 'Other' } */
	--g-trn-tf: ease; /* { friendly: 'Default Transition Timing Function', group: 'Other' } */	
	
	--grd-sp: 1.333rem; /* { min: 1, max: 2.5, step: 0.001, friendly: 'Grid Display Item Spacing', group: 'Spacing' } */
	--grd-sml-mpt: 0.8; /* { min: 0.1, max: 1, step: 0.1, friendly: 'Grid Small Multiplier', group: 'Spacing' } */
	--grd-lrg-mpt: 1.3; /* { min: 1, max: 2, step: 0.1, friendly: 'Grid Large Multiplier', group: 'Spacing' } */
	--grd-sp-sml: calc(var(--grd-sp) * var(--grd-sml-mpt)); /* { readonly: true } */
	--grd-sp-lrg: calc(var(--grd-sp) * var(--grd-lrg-mpt)); /* { readonly: true } */
	--grd-sp-dyn: var(--grd-sp); /* { readonly: true } */
	
	--mn-t: 58.4rem; /* { min: 15, max: 100, step: 0.1, friendly: 'Main Thin Value', group: 'Other' } */
	--mn-w: 88rem; /* { min: 15, max: 100, friendly: 'Main Wide Value', group: 'Other' } */
	--mn-f: 22.467rem; /* { min: 15, max: 100, friendly: 'Main Full Value', group: 'Other' } */
	--mn_ch-w: 82ch; /* { readonly: true } */
	--mn-sys: 72rem; /* { readonly: true } */
	
	--mn_min: 70vw; /* { readonly: true } */
	--mn_min-t: 41vw; /* { readonly: true } */
	--mn_max: 90vw; /* { readonly: true } */
	
	--py-i-s: 1.4rem; /* { type: 'range', min: 1, max: 3, step: 0.1, friendly: 'Payment Icon Font Size', group: 'Calculations' } */
	
	--rvw-str-clr: #FFD80A; /* { friendly: 'Review Star Colors', group: 'Colors' } */
	--rvw-str-s: 1.5rem; /* { min: 1, max: 4, step: 0.1, friendly: 'Review Star Font Size', type: 'range' } */
	--rvw-str-o: .5; /* { min: .2, max: .9, step: 0.001, friendly: 'Opacity For Inactive Review Stars' } */
	
	--sl-trn-sp: .6s; /* { min: .3, max: 2, step: 0.1, friendly: 'Scrolling List Transition Speed', group: 'Other' } */
	--sl-trn-tf: ease; /* { friendly: 'Scrolling List Timing Function', group: 'Other' } */
	--sl-sa-s: 1.1rem; /* { type: 'range', min: 1, max: 3, step: 0.1, friendly: 'Scrolling Arrows Font Size', group: 'Calculations' } */
	
	--so-i-s: 1.4rem; /* { type: 'range', min: 1, max: 3, step: 0.1, friendly: 'Social Media Icon Font Size', group: 'Calculations' } */
    
    --sp-hp: 2rem; /* { min: 60, max: 120, step: 1, friendly: 'Horizontal Padding Desktop', group: 'Spacing' } */
	--sp-vp: 3.5rem; /* { min: 60, max: 125, step: 1, friendly: 'Vertical Padding Desktop', group: 'Spacing' } */
	--sp-qk: 1rem; /* { min: 0.5, max: 1.5, step: 0.25, friendly: 'Quick Spacing', group: 'Spacing' } */
	--sp-vm: 40; /* { min: 30, max: 60, step: 1, friendly: 'Vertical Margin Desktop', group: 'Spacing' } */
	--sp-vm-mbl: 30; /* { min: 20, max: 40, step: 1, friendly: 'Vertical Margin Mobile', group: 'Spacing' } */
	
	--sp-vp-min: 6.3%; /* { readonly: true } */
	--sp-vp-max: 10%; /* { readonly: true } */
	--sp-vp-mn: 7.4; /* { readonly: true } */
	--sp-vp-mx: 10; /* { readonly: true } */
	--sp-hp-min: 8%; /* { readonly: true } */
	--sp-hp-max: 10%; /* { readonly: true } */
	--sp-hp-mn: 8%; /* { readonly: true } */
	--sp-hp-mx: 10%; /* { readonly: true } */
	
	--sp-vp-mmc: clamp(calc(var(--sp-vp-mn) * 1vw), var(--sp-vp), calc(var(--sp-vp-mx) * 1vw));  /* { readonly: true } */
	
	--sp-vm-clc: calc((var(--sp-vm-mbl) * 1px) + (var(--sp-vm) - var(--sp-vm-mbl)) * ((100vw - 320px) / (1920 - 320))); /* { readonly: true } */
	
	--svg-con-bdr-r: 50%; /* { min: 0,  max: 50, step: 1, friendly: 'SVG Container Border Radius', group: 'Other' } */
	--svg-con-s: 0.56rem; /* { min: 0,  max: 3, step: .1, friendly: 'SVG Container Size', group: 'Other' } */
	
	--tag-pd-v: 0.4em ; /* { min: 0.3,  max: 1, step: 0.1, friendly: 'Tag Vertical Padding', group: 'Calculations' } */
    --tag-pd-h: 1em; /* { min: 0.3,  max: 1.5, step: 0.1, friendly: 'Tag Horizontal Padding', group: 'Calculations' } */
	--tag-bdr-rds: 5em; /* { min: 0,  max: 5, step: 0.1, friendly: 'Tag Border Radius', group: 'Calculations' } */
	
	--bg-bx-bdr-thc: 4px; /* { min: 1,  max: 20, step: 1, friendly: 'BG Box Border Width' } */
	--bg-bx-bdr-clr-o: 1; /* { min: 0.1,  max: 1, step: .1, friendly: 'BG Box Border Opacity' } */
	
	[data-role="scroller"] {
		--sl-sa-pd-mtp: 2.5; /*{ min: 1, max: 2.5, step: 0.1, type: 'range', friendly: 'Side Scrolling Arrows Padding' }*/
	}
}


header:has(.hdr.lt-bg:not(.alt-bg)) + main > section.lt-bg[class*="pd_v"]:not(.alt-bg, .bg-image):first-child,
header:has(.hdr.lt-bg.alt-bg) + main > section.lt-bg.alt-bg[class*="pd_v"]:not(.bg-image):first-child,
header:has(.hdr.dk-bg:not(.alt-bg)) + main > section.dk-bg[class*="pd_v"]:not(.alt-bg, .bg-image):first-child,
header:has(.hdr.dk-bg.alt-bg) + main > section.dk-bg.alt-bg[class*="pd_v"]:not(.bg-image):first-child {
	padding-top: clamp(calc(var(--sp-vp-min) * 0.5), var(--sp-vp), calc(var(--sp-vp-max) * 0.5) );
}

main:has( > section:last-child:is(.lt-bg[class*="pd_v"]:not(.alt-bg, .bg-image))) + footer > section.lt-bg[class*="pd_v"]:not(.alt-bg, .bg-image):first-child,
main:has( > section:last-child:is(.lt-bg.alt-bg[class*="pd_v"]:not(.bg-image))) + footer > section.lt-bg.alt-bg[class*="pd_v"]:not(.bg-image):first-child,
main:has( > section:last-child:is(.dk-bg[class*="pd_v"]:not(.alt-bg, .bg-image))) + footer > section.dk-bg[class*="pd_v"]:not(.alt-bg, .bg-image):first-child,
main:has( > section:last-child:is(.dk-bg.alt-bg[class*="pd_v"]:not(.bg-image))) + footer > section.dk-bg.alt-bg[class*="pd_v"]:not(.bg-image):first-child,
main:has( > form:last-child > section:is(.lt-bg[class*="pd_v"]:not(.alt-bg, .bg-image))) + footer > section.lt-bg[class*="pd_v"]:not(.alt-bg, .bg-image):first-child,
main:has( > form:last-child > section:is(.lt-bg.alt-bg[class*="pd_v"]:not(.bg-image))) + footer > section.lt-bg.alt-bg[class*="pd_v"]:not(.bg-image):first-child,
main:has( > form:last-child > section:is(.dk-bg[class*="pd_v"]:not(.alt-bg, .bg-image))) + footer > section.dk-bg[class*="pd_v"]:not(.alt-bg, .bg-image):first-child,
main:has( > form:last-child > section:is(.dk-bg.alt-bg[class*="pd_v"]:not(.bg-image))) + footer > section.dk-bg.alt-bg[class*="pd_v"]:not(.bg-image):first-child{
	padding-top: 0;
}
.tag:not(:has(a)), .tag a {
	border: var(--bdr-stl) var(--bdr-w) hsl(from var(--text-color) h s l / var(--bdr-clr-o));
}


/* SVG Container */
.svg-con {
	border-radius: var(--svg-con-bdr-r);
	padding: var(--svg-con-s);
	background-color: var(--buttons);
	color: var(--btn-txt-clr);
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: calc(var(--svg-con-s) * 2);
	
	&.sml {
		--svg-con-s: 0.45rem;
	}
}

/* Bug Fix, Waiting on PR */
button:focus-visible {
	outline: -webkit-focus-ring-color auto 1px;

}

@media screen and (min-width:1280px) {
	
	[class*="shf"] {
		
		> .mn_tn {
			--con-w: clamp(var(--mn_min-t), var(--mn-t), var(--mn_max)) !important;
		}
	
	}
}


/* Panel Alignment Testing */
@media screen and (min-width:1280px) {
    section.pnl_l {
    	
    	[class*="ta_"] {
    		text-align: left;
    	}

        header {
            text-align: left;
        }

        .flr_hd {
            margin-left: 0;
            margin-right: auto;
        }
        
        .crd {
        	text-align: initial;
        }
    }

    section.pnl_c {
    	
    	[class*="ta_"]:not(.crd) {
    		text-align: center;
    	}

        header {
            text-align: center;
        }

        .flr_hd {
            margin-left: auto;
            margin-right: auto;
        }
        
        .pnl_f {
        	display: block !important;
        	
        	&[class*="flx-at-"] {
        		margin-top: var(--sp-vm-clc);
        	}
        }
        
        .crd {
        	text-align: initial;
        }
    }

    section.pnl_r {
    	
    	[class*="ta_"]:not(.crd) {
    		text-align: right;
    	}

        header {
            text-align: right;
        }

        .flr_hd {
            margin-right: 0;
            margin-left: auto;
        }
        
        .crd {
        	text-align: initial;
        }
    }
}


@media screen and (min-width:700px) {
	:root {
		--fnt-s-mtp: 1 !important;
	}
}


@media screen and (min-width:1280px) {
	:root {
		--mn_min: 60vw; /* { readonly: true } */
	}
	
    :where(.sd-zn, .cnt-zn) > * + * {
        margin-top: calc(var(--sp-vm-clc) * 1) !important;
    }

	
	/* Sets up system module widths to be easier to change */
	[class*="mn_"].sys_w {
		max-width: clamp(var(--mn_min), var(--mn-sys), var(--mn_max));
	}
	
	/* normal */
	.lt-bg[class*="pd_v"]:not(.alt-bg, .bg-image) + .lt-bg[class*="pd_v"]:not(.alt-bg, .bg-image),
	.lt-bg.alt-bg[class*="pd_v"]:not(.bg-image) + .lt-bg.alt-bg[class*="pd_v"]:not(.bg-image),
	.dk-bg[class*="pd_v"]:not(.alt-bg, .bg-image) + .dk-bg[class*="pd_v"]:not(.alt-bg, .bg-image),
	.dk-bg.alt-bg[class*="pd_v"]:not(.bg-image) + .dk-bg.alt-bg[class*="pd_v"]:not(.bg-image) {
	    padding-top: 0;
	}
	
	/* plus a form */
	.lt-bg[class*="pd_v"]:not(.alt-bg, .bg-image) + form .lt-bg[class*="pd_v"]:not(.alt-bg, .bg-image),
	.lt-bg.alt-bg[class*="pd_v"]:not(.bg-image) + form .lt-bg.alt-bg[class*="pd_v"]:not(.bg-image),
	.dk-bg[class*="pd_v"]:not(.alt-bg, .bg-image) + form .dk-bg[class*="pd_v"]:not(.alt-bg, .bg-image),
	.dk-bg.alt-bg[class*="pd_v"]:not(.bg-image) + form .dk-bg.alt-bg[class*="pd_v"]:not(.bg-image) {
	    padding-top: 0;
	}
	
	/* form plus (Doesn't work in FF) */
	form:has( .lt-bg[class*="pd_v"]:not(.alt-bg, .bg-image) ) + .lt-bg[class*="pd_v"]:not(.alt-bg, .bg-image),
	form:has( .lt-bg.alt-bg[class*="pd_v"]:not(.bg-image) ) + .lt-bg.alt-bg[class*="pd_v"]:not(.bg-image),
	form:has( .dk-bg[class*="pd_v"]:not(.alt-bg, .bg-image) ) + .dk-bg[class*="pd_v"]:not(.alt-bg, .bg-image),
	form:has( .dk-bg.alt-bg[class*="pd_v"]:not(.bg-image) ) + .dk-bg.alt-bg[class*="pd_v"]:not(.bg-image) {
	    padding-top: 0;
	}
	
	/* form plus form (Doesn't work in FF) */
	form:has( .lt-bg[class*="pd_v"]:not(.alt-bg, .bg-image) ) + form > .lt-bg[class*="pd_v"]:not(.alt-bg, .bg-image) ,
	form:has( .lt-bg.alt-bg[class*="pd_v"]:not(.bg-image) ) + form > .lt-bg.alt-bg[class*="pd_v"]:not(.bg-image),
	form:has( .dk-bg[class*="pd_v"]:not(.alt-bg, .bg-image) ) + form > .dk-bg[class*="pd_v"]:not(.alt-bg, .bg-image) ,
	form:has( .dk-bg.alt-bg[class*="pd_v"]:not(.bg-image) ) + form > .dk-bg.alt-bg[class*="pd_v"]:not(.bg-image)  {
	    padding-top: 0;
	}
	
	.fncy-imgs {
	
	    > *:first-child {
	        margin-right: calc(var(--fncy-imgs-ovp-a) * -1);
	    }
	
	    > *:last-child {
	        margin-left: calc(var(--fncy-imgs-ovp-a) * -1);
	    }
	}
	
}

@media screen and (max-width:1279px) {
	:root {
		--sp-vp-max-mbl: 16%; /* { readonly: true } */
	}
}
	