/* :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 320px */
:root {
  --global-hero-height: 5.8125rem; /* 93px */
  --global-hero-padding-top: var(--global-nav-height);
}

/* /////////////////////////////////////////////////////////////////////////////// HOME */
#id_page_content {
	padding-top: var(--global-hero-padding-top); /* !!! FORCES PAGE CONTENT BELOW NAV */
	/* !!! APPLY PADDING IN PLACE OF #id_hero */
}

/* ///////////////////////////////////////////////////////////////////// SECTION : HERO */
#id_hero {
	display: none; /* !!! DO NOT SHOW UNTIL MIN-HEIGHT */
}

/* ////////////////////////////////////////////////////////////// SECTION : HERO : ICON */
.hero-icon-container {
	display: none;
	transition: all var(--duration) ease-in-out;
}

.hero-icon {
	width: 100%;
  height: 100%;

  display: inline-block;
  position: relative;
  color: var(--white);
  text-decoration: none;

	transform: scale(1);
	transition: transform var(--duration-btn) cubic-bezier(0.6, 0, 0.4, 2);
	transform-origin: center; /* MUST BE PLACED AFTER TRANSITION */
}

.hero-icon:hover,
.hero-icon:focus {
  transform: scale(1.08);
}

#id_hero_icon_mini_svg {
	/* width: 100%; / * 2.375rem */
}

#id_hero_icon_mini_svg path {
	/* transition: all var(--duration-short) ease-in-out; */
	fill: var(--white);
	color: var(--white); /* M color */
}

/* ///////////////////////////////////////////////////////////// SECTION : HERO : IMAGE */
.hero-image-container {
  display: block;
  overflow: hidden;
	width: 100%;
  height: var(--global-hero-height);
	/*
	transition: all var(--duration-btn) cubic-bezier(0.6, 0, 0.4, 2);
	*/
	transition: all var(--duration) ease-in-out;
}

.hero-image {
  display: block;
	min-width: 100%;
	width: 100%;
	height: 100%;
  background-position: center; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover; /* Resize the background image to cover the entire container */
}

.hero-image-01 {
	background-image: url('../images/hero/hero_audi_ttrs_4758_1x_500x147.jpg');
}

.hero-image-02 {
	background-image: url('../images/hero/hero_porsche_gt3_5142_1x_500x147.jpg');
}

.hero-image-03 {
	background-image: url('../images/hero/hero_porsche_gt3_7213_1x_500x147.jpg');
}

.hero-image-04 {
	background-image: url('../images/hero/hero_audi_s4_2000_1x_500x147.jpg');
}

.hero-image-05 {
	background-image: url('../images/hero/hero_porsche_turbo_8880_1x_500x147.jpg');
}

.hero-image-06 {
	background-image: url('../images/hero/hero_bmw_m3_6859_1x_500x147.jpg');
}

.hero-image-07 {
	background-image: url('../images/hero/hero_volkswagen_r32_4988_1x_500x147.jpg');
}

.hero-image-08 {
	background-image: url('../images/hero/hero_vw_r32_9457_1x_500x147.jpg');
}

.hero-image-09 {
	background-image: url('../images/hero/hero_bmw_m3_5156_1x_500x147.jpg');
}

.hero-image-10 {
	background-image: url('../images/hero/hero_mbg_toolbox_2999_1x_500x147.jpg');
}

.hero-image-11 {
	background-image: url('../images/hero/hero_porsche_gt3_0551_1x_500x147.jpg');
}

.hero-image-12 {
	background-image: url('../images/hero/hero_volkswagen_gti_5580_1x_500x147.jpg');
}

.hero-image-13 {
	background-image: url('../images/hero/hero_volkswagen_gti_5594_1x_500x147.jpg');
}

.hero-image-14 {
	background-image: url('../images/hero/hero_volkswagen_gti_5602_1x_500x147.jpg');
}

.hero-image-15 {
	background-image: url('../images/hero/hero_audi_s6_6013_1x_500x147.jpg');
}

.hero-image-16 {
	background-image: url('../images/hero/hero_mercedes-benz_sl55_5859_1x_500x147.jpg');
}

.hero-image-17 {
	background-image: url('../images/hero/hero_mercedes-benz_sls_6324_1x_500x147.jpg');
}

.hero-image-18 {
	background-image: url('../images/hero/hero_bmw_m3_6851_1x_500x147.jpg');
}

.hero-image-19 {
	background-image: url('../images/hero/hero_bmw_m3_6945_1x_500x147.jpg');
}

.hero-image-20 {
	background-image: url('../images/hero/hero_bmw_m3_6976_1x_500x147.jpg');
}

/* :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 320px */
@media screen and (min-width: 320px) and (min-height: 320px) {
/* ////////////////////////////////////////////////////////// HERO IMAGE : 320px HEIGHT */
	#id_page_content {
		/* !!! REMOVE PADDING NOW THAT #id_hero IS DISPLAYED AGAIN */
		padding-top: 0rem;
	}

	#id_hero {
		display: flex;
		flex-direction: row;
		align-items: flex-end; /* display icon at bottom center */
		background-color: var(--white);
		padding-top: var(--global-hero-padding-top); /* !!! FORCES PAGE CONTENT BELOW NAV */
	}
}

/* :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 375px */
@media screen and (min-width: 375px) {
/* /////////////////////////////////////////////////////////// HERO IMAGE : 375px WIDTH */
	:root {
	  --global-hero-padding-top: var(--global-nav-height); /* !!! FORCES PAGE CONTENT BELOW NAV */
	}
}

/* ::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 600px HEIGHT + 600px WIDTH */
@media screen and (min-width: 600px) and (min-height: 600px) {
	:root {
		--global-hero-padding-top: 0rem; /* !!! FORCES PAGE CONTENT BELOW NAV */
	}

	.hero-icon-container {
		display: block;
		width: 1.5rem;
		height: 1.5rem;
		margin-bottom: -0.75rem; /* !!! Y POSITION RELATIVE TO BOTTOM OF HERO CONTAINER */
		position: absolute; /* !!! OVERLAY ICON ON HERO IMAGE */
	}
}

/* :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 600px */
@media screen and (min-width: 600px) {
/* /////////////////////////////////////////////////////////// HERO IMAGE : 600px WIDTH */
	.hero-image-01 {
		background-image: url('../images/hero/hero_audi_ttrs_4758_1x_800x234.jpg');
	}

	.hero-image-02 {
		background-image: url('../images/hero/hero_porsche_gt3_5142_1x_800x234.jpg');
	}

	.hero-image-03 {
		background-image: url('../images/hero/hero_porsche_gt3_7213_1x_800x234.jpg');
	}

	.hero-image-04 {
		background-image: url('../images/hero/hero_audi_s4_2000_1x_800x234.jpg');
	}

	.hero-image-05 {
		background-image: url('../images/hero/hero_porsche_turbo_8880_1x_800x234.jpg');
	}

	.hero-image-06 {
		background-image: url('../images/hero/hero_bmw_m3_6859_1x_800x234.jpg');
	}

	.hero-image-07 {
		background-image: url('../images/hero/hero_volkswagen_r32_4988_1x_800x234.jpg');
	}

	.hero-image-08 {
		background-image: url('../images/hero/hero_vw_r32_9457_1x_800x234.jpg');
	}

	.hero-image-09 {
		background-image: url('../images/hero/hero_bmw_m3_5156_1x_800x234.jpg');
	}

	.hero-image-10 {
		background-image: url('../images/hero/hero_mbg_toolbox_2999_1x_800x234.jpg');
	}

	.hero-image-11 {
		background-image: url('../images/hero/hero_porsche_gt3_0551_1x_800x234.jpg');
	}

	.hero-image-12 {
		background-image: url('../images/hero/hero_volkswagen_gti_5580_1x_800x234.jpg');
	}

	.hero-image-13 {
		background-image: url('../images/hero/hero_volkswagen_gti_5594_1x_800x234.jpg');
	}

	.hero-image-14 {
		background-image: url('../images/hero/hero_volkswagen_gti_5602_1x_800x234.jpg');
	}

	.hero-image-15 {
		background-image: url('../images/hero/hero_audi_s6_6013_1x_800x234.jpg');
	}

	.hero-image-16 {
		background-image: url('../images/hero/hero_mercedes-benz_sl55_5859_1x_800x234.jpg');
	}

	.hero-image-17 {
		background-image: url('../images/hero/hero_mercedes-benz_sls_6324_1x_800x234.jpg');
	}

	.hero-image-18 {
		background-image: url('../images/hero/hero_bmw_m3_6851_1x_800x234.jpg');
	}

	.hero-image-19 {
		background-image: url('../images/hero/hero_bmw_m3_6945_1x_800x234.jpg');
	}

	.hero-image-20 {
		background-image: url('../images/hero/hero_bmw_m3_6976_1x_800x234.jpg');
	}
}

/* :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 800px */
@media screen and (min-width: 800px) {
/* /////////////////////////////////////////////////////////// HERO IMAGE : 800px WIDTH */
	.hero-image-01 {
		background-image: url('../images/hero/hero_audi_ttrs_4758_1x_800x234.jpg');
	}

	.hero-image-02 {
		background-image: url('../images/hero/hero_porsche_gt3_5142_1x_800x234.jpg');
	}

	.hero-image-03 {
		background-image: url('../images/hero/hero_porsche_gt3_7213_1x_800x234.jpg');
	}

	.hero-image-04 {
		background-image: url('../images/hero/hero_audi_s4_2000_1x_800x234.jpg');
	}

	.hero-image-05 {
		background-image: url('../images/hero/hero_porsche_turbo_8880_1x_800x234.jpg');
	}

	.hero-image-06 {
		background-image: url('../images/hero/hero_bmw_m3_6859_1x_800x234.jpg');
	}

	.hero-image-07 {
		background-image: url('../images/hero/hero_volkswagen_r32_4988_1x_800x234.jpg');
	}

	.hero-image-08 {
		background-image: url('../images/hero/hero_vw_r32_9457_1x_800x234.jpg');
	}

	.hero-image-09 {
		background-image: url('../images/hero/hero_bmw_m3_5156_1x_800x234.jpg');
	}

	.hero-image-10 {
		background-image: url('../images/hero/hero_mbg_toolbox_2999_1x_800x234.jpg');
	}

	.hero-image-11 {
		background-image: url('../images/hero/hero_porsche_gt3_0551_1x_800x234.jpg');
	}

	.hero-image-12 {
		background-image: url('../images/hero/hero_volkswagen_gti_5580_1x_800x234.jpg');
	}

	.hero-image-13 {
		background-image: url('../images/hero/hero_volkswagen_gti_5594_1x_800x234.jpg');
	}

	.hero-image-14 {
		background-image: url('../images/hero/hero_volkswagen_gti_5602_1x_800x234.jpg');
	}

	.hero-image-15 {
		background-image: url('../images/hero/hero_audi_s6_6013_1x_800x234.jpg');
	}

	.hero-image-16 {
		background-image: url('../images/hero/hero_mercedes-benz_sl55_5859_1x_800x234.jpg');
	}

	.hero-image-17 {
		background-image: url('../images/hero/hero_mercedes-benz_sls_6324_1x_800x234.jpg');
	}

	.hero-image-18 {
		background-image: url('../images/hero/hero_bmw_m3_6851_1x_800x234.jpg');
	}

	.hero-image-19 {
		background-image: url('../images/hero/hero_bmw_m3_6945_1x_800x234.jpg');
	}

	.hero-image-20 {
		background-image: url('../images/hero/hero_bmw_m3_6976_1x_800x234.jpg');
	}
}

/* :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 600px */
@media screen and (min-width: 800px) and (min-height: 600px) {
/* //////////////////////////////////////////// HERO IMAGE : 800px WIDTH + 600px HEIGHT */
	.hero-icon-container {
		width: 1.75rem;
		height: 1.75rem;
		margin-bottom: -0.875rem; /* !!! Y POSITION RELATIVE TO BOTTOM OF HERO CONTAINER */
	}
}

/* ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 1000px */
@media screen and (min-width: 1000px) {
/* ////////////////////////////////////////////////////////// HERO IMAGE : 1000px WIDTH */
	.hero-image-01 {
		background-image: url('../images/hero/hero_audi_ttrs_4758_1x_1000x293.jpg');
	}

	.hero-image-02 {
		background-image: url('../images/hero/hero_porsche_gt3_5142_1x_1000x293.jpg');
	}

	.hero-image-03 {
		background-image: url('../images/hero/hero_porsche_gt3_7213_1x_1000x293.jpg');
	}

	.hero-image-04 {
		background-image: url('../images/hero/hero_audi_s4_2000_1x_1000x293.jpg');
	}

	.hero-image-05 {
		background-image: url('../images/hero/hero_porsche_turbo_8880_1x_1000x293.jpg');
	}

	.hero-image-06 {
		background-image: url('../images/hero/hero_bmw_m3_6859_1x_1000x293.jpg');
	}

	.hero-image-07 {
		background-image: url('../images/hero/hero_volkswagen_r32_4988_1x_1000x293.jpg');
	}

	.hero-image-08 {
		background-image: url('../images/hero/hero_vw_r32_9457_1x_1000x293.jpg');
	}

	.hero-image-09 {
		background-image: url('../images/hero/hero_bmw_m3_5156_1x_1000x293.jpg');
	}

	.hero-image-10 {
		background-image: url('../images/hero/hero_mbg_toolbox_2999_1x_1000x293.jpg');
	}

	.hero-image-11 {
		background-image: url('../images/hero/hero_porsche_gt3_0551_1x_1000x293.jpg');
	}

	.hero-image-12 {
		background-image: url('../images/hero/hero_volkswagen_gti_5580_1x_1000x293.jpg');
	}

	.hero-image-13 {
		background-image: url('../images/hero/hero_volkswagen_gti_5594_1x_1000x293.jpg');
	}

	.hero-image-14 {
		background-image: url('../images/hero/hero_volkswagen_gti_5602_1x_1000x293.jpg');
	}

	.hero-image-15 {
		background-image: url('../images/hero/hero_audi_s6_6013_1x_1000x293.jpg');
	}

	.hero-image-16 {
		background-image: url('../images/hero/hero_mercedes-benz_sl55_5859_1x_1000x293.jpg');
	}

	.hero-image-17 {
		background-image: url('../images/hero/hero_mercedes-benz_sls_6324_1x_1000x293.jpg');
	}

	.hero-image-18 {
		background-image: url('../images/hero/hero_bmw_m3_6851_1x_1000x293.jpg');
	}

	.hero-image-19 {
		background-image: url('../images/hero/hero_bmw_m3_6945_1x_1000x293.jpg');
	}

	.hero-image-20 {
		background-image: url('../images/hero/hero_bmw_m3_6976_1x_1000x293.jpg');
	}
}

/* :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 600px */
@media screen and (min-width: 1000px) and (min-height: 600px) {
/* /////////////////////////////////////////// HERO IMAGE : 1000px WIDTH + 600px HEIGHT */
	.hero-icon-container {
		width: 2rem;
		height: 2rem;
		margin-bottom: -1rem; /* !!! Y POSITION RELATIVE TO BOTTOM OF HERO CONTAINER */
	}
}

/* :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 600px */
@media screen and (min-width: 1200px) and (min-height: 600px) {
/* /////////////////////////////////////////// HERO IMAGE : 1200px WIDTH + 600px HEIGHT */
	.hero-icon-container {
		width: 2.25rem;
		height: 2.25rem;
		margin-bottom: -1.125rem; /* !!! Y POSITION RELATIVE TO BOTTOM OF HERO CONTAINER */
	}
}

/* ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 1600px */
@media (min-width: 1600px) {
/* ////////////////////////////////////////////////////////// HERO IMAGE : 1600px WIDTH */
	.hero-image-01 {
		background-image: url('../images/hero/hero_audi_ttrs_4758_1x_1600x468.jpg');
	}

	.hero-image-02 {
		background-image: url('../images/hero/hero_porsche_gt3_5142_1x_1600x468.jpg');
		background-position-y: 60%;
	}

	.hero-image-03 {
		background-image: url('../images/hero/hero_porsche_gt3_7213_1x_1600x468.jpg');
	}

	.hero-image-04 {
		background-image: url('../images/hero/hero_audi_s4_2000_1x_1600x468.jpg');
	}

	.hero-image-05 {
		background-image: url('../images/hero/hero_porsche_turbo_8880_1x_1600x468.jpg');
	}

	.hero-image-06 {
		background-image: url('../images/hero/hero_bmw_m3_6859_1x_1600x468.jpg');
	}

	.hero-image-07 {
		background-image: url('../images/hero/hero_volkswagen_r32_4988_1x_1600x468.jpg');
	}

	.hero-image-08 {
		background-image: url('../images/hero/hero_vw_r32_9457_1x_1600x468.jpg');
	}

	.hero-image-09 {
		background-image: url('../images/hero/hero_bmw_m3_5156_1x_1600x468.jpg');
	}

	.hero-image-10 {
		background-image: url('../images/hero/hero_mbg_toolbox_2999_1x_1600x468.jpg');
	}

	.hero-image-11 {
		background-image: url('../images/hero/hero_porsche_gt3_0551_1x_1600x468.jpg');
	}

	.hero-image-12 {
		background-image: url('../images/hero/hero_volkswagen_gti_5580_1x_1600x468.jpg');
	}

	.hero-image-13 {
		background-image: url('../images/hero/hero_volkswagen_gti_5594_1x_1600x468.jpg');
	}

	.hero-image-14 {
		background-image: url('../images/hero/hero_volkswagen_gti_5602_1x_1600x468.jpg');
	}

	.hero-image-15 {
		background-image: url('../images/hero/hero_audi_s6_6013_1x_1600x468.jpg');
	}

	.hero-image-16 {
		background-image: url('../images/hero/hero_mercedes-benz_sl55_5859_1x_1600x468.jpg');
	}

	.hero-image-17 {
		background-image: url('../images/hero/hero_mercedes-benz_sls_6324_1x_1600x468.jpg');
	}

	.hero-image-18 {
		background-image: url('../images/hero/hero_bmw_m3_6851_1x_1600x468.jpg');
	}

	.hero-image-19 {
		background-image: url('../images/hero/hero_bmw_m3_6945_1x_1600x468.jpg');
	}

	.hero-image-20 {
		background-image: url('../images/hero/hero_bmw_m3_6976_1x_1600x468.jpg');
	}
}

/* :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 600px */
@media screen and (min-width: 1600px) and (min-height: 600px) {
/* /////////////////////////////////////////// HERO IMAGE : 1600px WIDTH + 600px HEIGHT */
	.hero-icon-container {
		width: 2.375rem;
		height: 2.375rem;
		margin-bottom: -1.1875rem; /* !!! Y POSITION RELATIVE TO BOTTOM OF HERO CONTAINER */
	}
}

/* ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 2000px */
@media screen and (min-width: 2000px) {
/* ////////////////////////////////////////////////////////// HERO IMAGE : 2000px WIDTH */
	.hero-image-01 {
		background-image: url('../images/hero/hero_audi_ttrs_4758_1x_2880x842.jpg');
	}

	.hero-image-02 {
		background-image: url('../images/hero/hero_porsche_gt3_5142_1x_2880x842.jpg');
		background-position-y: 60%;
	}

	.hero-image-03 {
		background-image: url('../images/hero/hero_porsche_gt3_7213_1x_2880x842.jpg');
	}

	.hero-image-04 {
		background-image: url('../images/hero/hero_audi_s4_2000_1x_2880x842.jpg');
	}

	.hero-image-05 {
		background-image: url('../images/hero/hero_porsche_turbo_8880_1x_2880x842.jpg');
	}

	.hero-image-06 {
		background-image: url('../images/hero/hero_bmw_m3_6859_1x_2880x842.jpg');
	}

	.hero-image-07 {
		background-image: url('../images/hero/hero_volkswagen_r32_4988_1x_2880x842.jpg');
	}

	.hero-image-08 {
		background-image: url('../images/hero/hero_vw_r32_9457_1x_2880x842.jpg');
	}

	.hero-image-09 {
		background-image: url('../images/hero/hero_bmw_m3_5156_1x_2880x842.jpg');
	}

	.hero-image-10 {
		background-image: url('../images/hero/hero_mbg_toolbox_2999_1x_2880x842.jpg');
	}

	.hero-image-11 {
		background-image: url('../images/hero/hero_porsche_gt3_0551_1x_2880x842.jpg');
	}

	.hero-image-12 {
		background-image: url('../images/hero/hero_volkswagen_gti_5580_1x_2880x842.jpg');
	}

	.hero-image-13 {
		background-image: url('../images/hero/hero_volkswagen_gti_5594_1x_2880x842.jpg');
	}

	.hero-image-14 {
		background-image: url('../images/hero/hero_volkswagen_gti_5602_1x_2880x842.jpg');
	}

	.hero-image-15 {
		background-image: url('../images/hero/hero_audi_s6_6013_1x_2880x842.jpg');
	}

	.hero-image-16 {
		background-image: url('../images/hero/hero_mercedes-benz_sl55_5859_1x_2880x842.jpg');
	}

	.hero-image-17 {
		background-image: url('../images/hero/hero_mercedes-benz_sls_6324_1x_2880x842.jpg');
	}

	.hero-image-18 {
		background-image: url('../images/hero/hero_bmw_m3_6851_1x_2880x842.jpg');
	}

	.hero-image-19 {
		background-image: url('../images/hero/hero_bmw_m3_6945_1x_2880x842.jpg');
	}

	.hero-image-20 {
		background-image: url('../images/hero/hero_bmw_m3_6976_1x_2880x842.jpg');
	}
}


/* :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 480px WIDTH */
@media screen and (min-width: 480px) and (min-height: 480px) {
	:root {
		--global-hero-height: 8.7rem; /* 139.2px */
	}
}

/* :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 600px WIDTH */
@media screen and (min-width: 600px) and (min-height: 600px) {
	:root {
		--global-hero-height: 10.875rem; /* 174px */
	}
}

/* :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 800px WIDTH */
@media screen and (min-width: 800px) and (min-height: 800px) {
	:root {
		--global-hero-height: 14.5rem; /* 232px */
	}
}

/* ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 1000px WIDTH */
@media screen and (min-width: 1000px) and (min-height: 1000px) {
	:root {
		--global-hero-height: 18.125rem; /* 290px */
	}
}

/* ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 1200px WIDTH */
@media screen and (min-width: 1200px) and (min-height: 1200px) {
	:root {
		--global-hero-height: 21.75rem; /* 348px */
	}
}

/* ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 1440px WIDTH */
@media screen and (min-width: 1440px) and (min-height: 1200px) {
	:root {
		--global-hero-height: 26.1rem; /* 417.6px */
	}
}

/* ::::::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : ORIENTATION PORTRAIT */
@media screen and (orientation: portrait) {
/* :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 480px WIDTH */
	@media screen and (min-width: 480px) {
/* ::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 481px HEIGHT + 480px WIDTH */
		@media screen and (min-height: 481px) {
			:root {
				--global-hero-height: 5rem; /* 80px */
			}
		}

/* ::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 600px HEIGHT + 480px WIDTH */
		@media screen and (min-height: 600px) {
			:root {
				--global-hero-height: 5rem; /* 80px */
				--global-hero-height: 6.25rem; /* 100px */
			}
		}

/* ::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 800px HEIGHT + 480px WIDTH */
		@media screen and (min-height: 800px) {
			:root {
				--global-hero-height: 7.5rem; /* 120px */
			}
		}

/* :::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 1000px HEIGHT + 480px WIDTH */
		@media screen and (min-height: 1000px) {
			:root {
				--global-hero-height: 9rem; /* 144px */
			}
		}

/* :::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 1200px HEIGHT + 480px WIDTH */
		@media screen and (min-height: 1200px) {
			:root {
				--global-hero-height: 11rem; /* 176px */
			}
		}
	}

/* :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 600px WIDTH */
	@media screen and (min-width: 600px) {
/* ::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 601px HEIGHT + 600px WIDTH */
	@media screen and (min-height: 601px) {
		:root {
			--global-hero-height: 6.25rem; /* 100px */
			--global-hero-height: 12rem; /* 192px WORK HERE */
		}
	}

/* ::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 800px HEIGHT + 600px WIDTH */
		@media screen and (min-height: 800px) {
			:root {
				/* --global-hero-height: 11.4375rem; / * 183px */
				--global-hero-height: 12rem; /* 192px */
			}
		}

/* :::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 1000px HEIGHT + 600px WIDTH */
		@media screen and (min-height: 1000px) {
			:root {
				/* --global-hero-height: 11.4375rem; / * 183px */
				--global-hero-height: 12rem; /* 192px */
			}
		}
	}

/* :::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 801px HEIGHT + 800px WIDTH */
	@media screen and (min-width: 800px) and (min-height: 801px) {
		:root {
			--global-hero-height: 14rem; /* 192px */
		}
	}

/* ::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 1001px HEIGHT + 1000px WIDTH */
	@media screen and (min-width: 1000px) and (min-height: 1001px) {
		:root {
			--global-hero-height: 18rem; /* 288px */
		}
	}
}

/* :::::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : ORIENTATION LANDSCAPE */
@media screen and (orientation: landscape) {
/* ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 600px HEIGHT */
	@media screen and (min-height: 600px) {
/* ::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 600px HEIGHT + 800px WIDTH */
		@media screen and (min-width: 800px) {
			:root {
				--global-hero-height: 14rem; /* 224px */
			}
		}

/* :::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 600px HEIGHT + 1000px WIDTH */
		@media screen and (min-width: 1000px) {
			:root {
				--global-hero-height: 15rem; /* 240px */
			}
		}

/* :::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 600px HEIGHT + 1200px WIDTH */
		@media screen and (min-width: 1200px) {
			:root {
				--global-hero-height: 16rem; /* 256px */
			}
		}
	}

/* ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 800px HEIGHT */
	@media screen and (min-height: 800px) {
/* :::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 800px HEIGHT + 1000px WIDTH */
		@media screen and (min-width: 1000px) {
			:root {
				--global-hero-height: 15rem; /* 240px */
			}
		}

/* :::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 800px HEIGHT + 1200px WIDTH */
		@media screen and (min-width: 1200px) {
			:root {
				--global-hero-height: 16rem; /* 256px */
			}
		}

/* :::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 800px HEIGHT + 1440px WIDTH */
		@media screen and (min-width: 1440px) {
			:root {
				--global-hero-height: 17rem; /* 272px */
			}
		}
	}


/* :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 1000px HEIGHT */
	@media screen and (min-height: 1000px) {
/* ::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 1000px HEIGHT + 1001px WIDTH */
		@media screen and (min-width: 1001px) {
			:root {
				--global-hero-height: 18rem; /* 288px */
			}
		}

/* ::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 1000px HEIGHT + 1440px WIDTH */
		@media screen and (min-width: 1440px) {
			:root {
				--global-hero-height: 20rem; /* 320px */
			}
		}
	}

/* :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 1200px HEIGHT */
	@media screen and (min-height: 1200px) {
/* ::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 1200px HEIGHT + 1201px WIDTH */
		@media screen and (min-width: 1201px) {
			:root {
				--global-hero-height: 22rem; /* 352px */
			}
		}

/* ::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 1200px HEIGHT + 1400px WIDTH */
		@media screen and (min-width: 1400px) {
			:root {
				--global-hero-height: 24rem; /* 384px */
			}
		}

/* ::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 1200px HEIGHT + 1600px WIDTH */
		@media screen and (min-width: 1600px) {
			:root {
				--global-hero-height: 26.3125rem; /* 421px */
			}
		}
	}
}



/*
/ * ::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 480px HEIGHT + px WIDTH * /
	@media screen and (min-height: 480px) {
		:root {
			--global-hero-height: 5.8125rem;
		}
	}

/ * ::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 600px HEIGHT + px WIDTH * /
	@media screen and (min-height: 600px) {
		:root {
			--global-hero-height: 12rem;
		}
	}

/ * ::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 800px HEIGHT + px WIDTH * /
	@media screen and (min-height: 800px) {
		:root {
			--global-hero-height: 15rem;
		}
	}

/ * ::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 1000px HEIGHT + px WIDTH * /
	@media screen and (min-height: 1000px) {
		:root {
			--global-hero-height: 18rem;
		}
	}

/ * ::::::::::::::::::::::::::::::::::::::::::::::: MEDIA : 1200px HEIGHT + px WIDTH * /
	@media screen and (min-height: 1200px) {
		:root {
			--global-hero-height: 22rem;
		}
	}

*/




/*
WORK HERE
- hero image breakpoints 2880 x 842 = .29

IMAGES SWAPPED AT WIDTHS FOR IMAGE FIDELITY
- 320px - 599px 	[ use 500px image ]
- 600px - 999px 	[ use 800px image ]
- 1000px - 1599px [ use 1000px image ]
- 1600px - 2399px [ use 1600px image ]
- 2400px+ 				[ use 2880px image ]

MIN-HEIGHT: 320px --global-hero-height: 5.8125rem;

MIN-HEIGHT: 600px + MIN-WIDTH: 600px
	- --global-hero-height: 6.25rem;

MIN-WIDTH: 480px
	- MIN-HEIGHT: 480px --global-hero-height: 5rem; / 139.2px : 8.7rem
	- MIN-HEIGHT: 600px --global-hero-height: 6.25rem; / px : rem
	- MIN-HEIGHT: 800px --global-hero-height: 7.5rem; / px : rem
	- MIN-HEIGHT: 1000px --global-hero-height: 9rem; / px : rem
	- MIN-HEIGHT: 1200px --global-hero-height: 11rem; / px : rem

MIN-HEIGHT: 600px
	- MIN-WIDTH: 480px --global-hero-height: 5rem; / 139.2px : 8.7rem
	- MIN-WIDTH: 600px --global-hero-height: 12rem; ** 600 / 174px : 10.875rem
	- MIN-WIDTH: 800px --global-hero-height: 14rem; ** 800 / 232px : 14.5rem
	- MIN-WIDTH: 1000px --global-hero-height: 15rem; ** 1000 / 290px : 18.125rem
	- MIN-WIDTH: 1200px --global-hero-height: 16rem; ** 1200 / 348px : 21.75rem

MIN-HEIGHT: 800px
	- MIN-WIDTH: 600px --global-hero-height: 12rem; ** 600 / px : rem
	- MIN-WIDTH: 800px --global-hero-height: 14rem; ** 800 / px : rem
	- MIN-WIDTH: 1000px --global-hero-height: 15rem; ** 1000 / px : rem
	- MIN-WIDTH: 1200px --global-hero-height: 16rem; ** 1200 / px : rem
	- MIN-WIDTH: 1440px --global-hero-height: 17rem; / 417.6px : 26.1rem

MIN-HEIGHT: 1000px
	- MIN-WIDTH: 600px --global-hero-height: 12rem; ** 600 / px : rem
	- MIN-WIDTH: 800px --global-hero-height: 14rem; ** 800 / px : rem
	- MIN-WIDTH: 1000px --global-hero-height: 18rem; / px : rem
	- MIN-WIDTH: 1200px --global-hero-height: 18rem; / px : rem
	- MIN-WIDTH: 1440px --global-hero-height: 20rem; / px : rem
*/

	/* WORK HERE : UPDATE ALL INFO BELOW THIS LINE
FILES FOR EACH IMAGE
** HERO IMAGES **
- 3 breakpoints x 3 resolutions = 9 versions of each image
- EXCEPT: the sizes are very similar, only creating resolutions = 3 versions of each image

	120 - 190 - 270 @ 2w phone
	256 - 270 @ 2w
	173 - 346 @ 3w
	250 - 330 @ 4w

	- 0 - 600px : 1:1 [ image 120px - 270px ]
		- 1x: 350 x 350 47kb
		- 2x: 700 x 700 196kb
		- 3x: 1050 x 1050 387kb

	- 600px - 1199px : 1:1 [ image 173px - 346px ]
		- 1x: 350 x 350
		- 2x: 700 x 700
		- 3x: 1050 x 1050

	- 1200px+ : 1:1 [ image: 250px - 330px ]
		- 1x: 350 x 350
		- 2x: 700 x 700
		- 3x: 1050 x 1050

	*/

/*
- 0 - 480px : .5 / 2:1
	- 1x: 500 x 250
	- 2x: 1000 x 500
	- 3x: 1500 x 750
	- 4x: 2000 x 1000
*/

/* WORK HERE
- 600px - 1199px : .29 / 3:1
	- 1x: 1200 x 400
	- 2x: 2400 x 800
	- 3x: 3600 x 1200
	- 4x: 4800 x 1600
*/

/*
- 1200px+ .25 / 4:1
	- 1x: 1440 x 360
	- 2x: 2880 x 720
	- 3x: 4320 x 1080
	- 4x: 5760 x 1440
*/