/* GraspIT Landing Page - Head Image Section Specific Styles --Start-- */
	
	/* Head Image */
	.HeadImage {
		object-position: top;
		position: relative;
		text-align: center;
	}
	
	.HeadImage > div:first-child {
		background: url('resources/images/landing-page-image-V3.jpg');
		background-position: center;
	}
	
	.HeadImage > div:last-child {
		top: 25%;
		left: 5%;
		right: 5%;
		text-align: center;
	}
	
	.HeadImage > div h1 img {
		margin-right: 29.75rem;
	}
	
	@media (max-width: 1199px) {
		.HeadImage > div h1 img {
			margin-right: 29.75rem;
		}
	}
	
	@media (max-width: 899px) {
		.HeadImage > div h1 img {
			margin-right: 30.75rem;
		}
	}
	
	@media (max-width: 651px) {
		.HeadImage > div h1 img {
			margin-right: 24.75rem;
		}
	}
	
	@media (max-width: 538px) {
		.HeadImage > div h1 img {
			margin-right: 21rem;
		}
	}
	
	@media (max-width: 475px) {
		.HeadImage > div h1 img {
			margin-right: 18.5rem;
		}
	}
	
	@media (max-width: 463px) {
		.HeadImage > div h1 img {
			margin-right: 0;
		}
		
		.HeadImage > div h1 {
			text-align: left;
		}
	}
	
	@media (max-width: 320px) {
		.HeadImage > div h1 img {
			margin-right: 0;
		}
	}

	/* Copied */
	/* Headings */
	h1 {
		color: #000000;
	}
	
	/* Copied */
	/* Service Objects(Icons) */
	.col-xs-6 {
		width: 50%;
	}
	
	.ServiceObjects {
		text-align: center;
		margin: auto;
		padding: 1.5rem;
	}
	
	.ServiceObjects > a > div > p {
		color: #ffffff !important;
	}
	
	.ServiceObjects:hover > a > div > p {
		color: #e6ae02 !important;
	}
	
	.ServiceObjects:hover > a {
		text-decoration: none !important;
	}
	
	@media (max-width: 400px) {
		.ServiceObjects img {
			width: 100% !important;
		}
	}
	
	.FlexCol {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
	}

	.FlexCol, .FlexCol.BlankCol {
		flex: 20%;
	}
	
	.FlexCol > a > img {
		width: 100%;
	}
	
	#AgileBusIcon {
		margin-left: 0;
	}
	
	#AgileCoachIcon {
		margin-right: 0;
	}
	
	@media (max-width: 859px) {
		.FlexCol.BlankCol {
			display: none;
		}
		
		.FlexCol > a > img {
			width: inherit;
		}
		
		@media (max-width: 660px) {
			@media (min-width: 618px) {
				#AgileBusIcon {
					margin-left: 0rem !important;
				}
				
				#AgileCoachIcon {
					margin-right: 0rem !important;
				}
			}
		}
		
		@media (min-width: 661px) {
			#AgileBusIcon {
				margin-left: 5rem !important;
			}
			
			#AgileCoachIcon {
				margin-right: 5rem !important;
			}
		}
	}
	
	@media (max-width: 400px) {
		.ServiceObjects {
			flex: 100% !important;
		}
		
		.ServiceObjects img {
			width: 40% !important;
		}
	}
	
	/* Copied */
	/* Tab Control */
	.Tab {
		overflow: hidden;
		background-color: transparent;
		display: none;
		width: 100%;
	}

	.Tab button.active {
		background-color: #ffffff;
		color: #000000;
	}

	.Tab button:hover {
		background-color: #f0b045;
		color: #000000;
	}

	.Tab button {
		background-color: #437184;
		float: left;
		border: none;
		outline: none;
		cursor: pointer;
		padding: 14px 10px;
		transition: 0.3s;
	}

	.TabLinks {
		border-right: 5px solid #ffffff !Important;
		font-weight: normal;
		color: #ffffff;
		flex: 20%;
	}

	.TabLinks.LastTab {
		border-right: none !Important;
	}

	.TabContent {
		margin-left: 0%;
		margin-right: 0%;
		padding: 0 1rem;
		height: auto !important;
		position: absolute;
		width: 100%;
		top: 50%;
		background-color: transparent;
		transform: translateY(-50%);
	}

	#TabContentOuter {
		height: 350px;
		position: relative;
	}

	body.NoJS #TabContentOuter {
		height: auto !important;
	}

	body.NoJS .TabContent {
		position: relative;
		top: 0%;
		transform: none;
		padding: 2rem 1rem;
	}
	
	@media (max-width: 703px) {
		.TabLinks {
			flex: 100%;
			border-right: none !important;
			border-bottom: 5px solid #ffffff !Important;
			padding: 10px 10px !important;
		}
		
		.TabLinks:first-child {
			border-top: 5px solid #ffffff !Important;
		}
		
		.Tab > button.TabLinks.active {
			background-color: #f0b045 !important;
		}
		
		.TabContent {
			padding-top: 2rem !important;
			padding-bottom: 2rem !important;
			top: 0% !important;
			transform: none !important;
		}
		
		#Benefits {
			padding-left: 2px;
			padding-right: 2px;
		}
	}

	@media (max-width: 640px) {
		#TabContentOuter {
			height: 350px !important;
		}
	}
	
	@media (max-width: 575px) {
		#TabContentOuter {
			height: 400px !important;
		}
	}
	
	@media (max-width: 465px) {
		#TabContentOuter {
			height: 600px !important;
		}
	}

	@media (max-width: 415px) {
		.TabContent {
			height: 950px;
		}
	}

	@media (max-width: 300px) {
		#TabContentOuter {
			height: 700px !important;
		}
	}
	
	/* Copied */
	/* Page Margins */
	@media (min-width: 992px) {
		.LandingMargin.col-lg-1 {
			flex: 0 0 4.333333%;
			max-width: 4.333333%;
		}

		.LandingMargin.col-lg-10 {
			flex: 0 0 91.333333%;
			max-width: 91.333333%;
		}
	}
	
	@media (min-width: 768px) {
		.LandingMargin.col-md-1 {
			flex: 0 0 4.333333%;
			max-width: 4.333333%;
		}

		.LandingMargin.col-md-10 {
			flex: 0 0 91.333333%;
			max-width: 91.333333%;
		}
	}

	/* NEED TO TEST */
	/* CAN WE REMOVE */
	.HeadingContent {
		padding-top: 7rem;
		padding-bottom: 7rem;
	}

	.LandingContent p {
		font-size: 1.5rem;
	}

	/* Automatically Adjusts size for content */
	@media (max-width: 500px) {
		.TabContent {
			height: auto;
		}
	}
	
/* --End-- */