@media screen
	{
		/* #-------------------- SECTION: HTML; -- */
		html
			{
				/* NOTE: PROPERTY(S) FOR LAYOUT */
				overflow-y:					scroll;	/*NOTE: ALWAYS SHOW SCROLL BAR TO STOP UI FROM JUMPING;*/
			}

		/* #-------------------- SECTION: BODY; -- */
		html body
			{
				background-color:			rgba(1, 55, 125, 1);
				color:						rgba( 255,255,255,1 );

				font-family:				'HammersmithOne', 'arial', Courier, monospace!important;
				font-size:					200%;
				margin:						0;

				text-transform: 			capitalize;
			}

		html body *
			{
				/* NOTE: PROPERTY(S) FOR Animation */
				animation-name:				AnimationNavigationMainChecked;
				animation-duration:			2s;
			}

		/* #-------------------- SECTION: HEADER; -- */
		html body header
			{
				border-bottom:				var( --Border-Global );
				padding-left:				2%;
				padding-right:				2%;
			}

		html body header h1
			{
				font-family:				var( --Font-Heading );
				font-size:					300%;
				font-weight:				normal;
				text-align:					center;
				margin-bottom:				1%;
				margin-top:					2%;
				line-height:				100px;
			}

		/* #-------------------- SECTION: MAIN CONTENT; -- */
		html body main div#VideoHero video
			{
				/* NOTE: PROPERTY(S) FOR LAYOUT */
				border-bottom:				var( --Border-Global );
				display:					block;	/* NOTE: NEEDED BECAUSE OF WEIRD MARGIN OR PADDING IF NOT PRESENT */	
				height:						600px;
				object-fit:					cover;
				width:						100%;  
			}
		
		html body main
			{
				padding-bottom:				1%;
				text-align:					center;
			}
			
		html body main h2
			{
				font-family:				var( --Font-Heading );
				font-size:					200%;
				font-weight:				normal;
				text-align:					center;
				margin-bottom:				0;
				padding-bottom:				0;
				line-height:				80px;
			}
			
		html body main ul
			{
				margin-bottom:				0;
				margin-top:					0;
				list-style-type:			none;
			}
			
		html body main div.Plan
			{
				border-bottom:				var( --Border-Global );
				padding-bottom: 			1%;
			}
		
		html body main div.Plan h3.Time
			{
				margin-top:					0;
				padding-top:				0;
			}
			
		html body main div.Plan h3.Pricing
			{
				/*font-family:				var( --Font-Heading );*/
			}

		html body main div.PlanContainer
			{
				display:					grid;
				grid-template-columns:		repeat( 3, 1fr);		/* 3 columns grid */
			}
			
		html body main div.PlanContainer div.Plan
			{
				border:						var( --Border-Global );
				margin:						2%;
				padding:					10px;
				border-radius:				25px;
			}
		
		/* #-------------------- SECTION: FOOTER; -- */
		html body footer
			{
				border-top:					var( --Border-Global );
				font-size:					60%;
				padding-left:				2%;
				padding-right:				2%;
				text-align:					center;
			}
		html body footer ul
			{
				list-style-type:			none;
				padding-left:				0px;
			}
		html body footer ul li
			{
				margin-bottom:				15px;
			}
	}