/* General Flex Styles */
[class*='flx'] {
	align-items: stretch;
	align-content: space-around;
	display: flex;
	
	&[class*='flx-at-']:not([class*="sw-"]) {
	    display: block;
	}
	
	&:is(.f_gp) > :is(:not([data-columns],.fit), :only-child),
	.ato {
		flex: 1 1 auto;
	}
	
	.fit {
		flex: 0 0 auto;
	}
	
	.str {
		align-self: stretch;
	}
}

.f_c {
	justify-content: center;
}

.f_r {
	justify-content: flex-end;
}

.f_sb {
	justify-content: space-between;
}

.f_sa {
	justify-content: space-around;
}

.f_gp {
    column-gap: var(--flx-gap);
    
    > .half {
		width: calc(var(--half) - (var(--flx-gap) / 2 ));
	}
	
	> .third {
		width: calc(var(--third) - (var(--flx-gap) / 2 ));
	}
	
	> .two-thirds {
		width: calc(var(--two-3rds) - (var(--flx-gap) / 2 ));
	}
	
	> .three-8ths {
		width: calc(var(--three-8ths) - (var(--flx-gap) / 2 ));
	}
	
	> .five-8ths {
		width: calc(var(--five-8ths) - (var(--flx-gap) / 2 ));
	}
}

.f_m {
	align-items: center;
}

.f_t {
	align-items: flex-start;
}

.f_b {
	align-items: flex-end;
}

.f_bl {
	align-items: baseline;
}

.f_wrp {
	flex-wrap: wrap;
}

.f_rev {
	flex-direction: row-reverse;
}

.f_clm {
	flex-direction: column;
}

.f_nln {
	display: inline-flex;
}

/* 700px Responsive (min-width) */
@media screen and (min-width:700px) {
    [class*='flx'][class*="-at-700"]:not([class*="sw-"]) {
        display: flex;
	    
	    > * { 
	        margin-block: 0 !important;
	    }
    }

}

/* 1280px Responsive (min-width) */
@media screen and (min-width: 1280px) {

    [class*='flx'][class*="-at-1280"]:not([class*="sw-"]) {
        display: flex;
	    
	    > * {
	        margin-block: 0 !important;
	    }
    }


}

/* 1500px Responsive (min-width) */
@media screen and (min-width:1500px) {

    [class*='flx'][class*="-at-1500"]:not([class*="sw-"]) {
        display: flex;
	    
	    > * {
	        margin-block: 0 !important;
	    }
    }


}

/* 1499px Responsive */
@media screen and (max-width:1499px) {

	[class*='flx'][class*="-at-1500"] {
		
		&[class*="gp_sp"] > * + * {
			margin-top: var(--grd-sp-dyn);
		}
		
		> :not(svg, .full-mbl, .btn, .max-cnt) {
			width: 100% !important;
			max-width: 100% !important;
			margin-inline: 0;
			
		}
	}
	
}

/* 1279px Responsive */
@media screen and (max-width:1279px) {
	
	[class*='flx'][class*="-at-1280"] {
		
		&[class*="gp_sp"] > * + * {
			margin-top: var(--grd-sp-dyn);
		}
		
		> :not(svg, .full-mbl, .btn, .max-cnt) {
			width: 100% !important;
			max-width: 100% !important;
			margin-inline: 0;
		}
	}

}

/* 699px Responsive */
@media screen and (max-width:699px) {	
	
	[class*='flx'][class*="-at-700"] {
		
		&[class*="gp_sp"] > * + * {
			margin-top: var(--grd-sp-dyn);
		}
		
		> :not(svg, .full-mbl, .btn, .max-cnt) {
			width: 100% !important;
			max-width: 100% !important;
			margin-inline: 0;
			
		}
	}
	
}