@import './tailwind-output.css';

:root {
	--grey:#8BAEB8;
	--darkGrey:#021C22;
	--lightGrey:#EEEEEE;
	--green:#56BB25;
	--fadedGreen: rgba(76, 175, 80, 0.25); 
	--fadedDarkGreen:rgba(40, 69, 78, 0.2);
	--lightBlue:#ebf0f1;
	--darkBlue:#9ab1b7;
	--font1:"Poppins", sans-serif;
	--font2:"Red Hat Display", sans-serif;
}
@media screen and (min-width:1550px) {
	.container {
		max-width:1400px;
	}
}
.container {
	padding-left:0.9rem;
	padding-right:0.9rem;
}
HEADER {
	border-bottom:1px solid transparent;
}
HEADER .grid IMG {
	transition:.5s;
}
HEADER.header--scrolled {
	background-color:var(--darkGrey);
	border-color:var(--fadedGreen);
	transition:.5s;
}
HEADER.header--scrolled.header--scrolling-down {
	top:-100%;
}
HEADER.header--scrolled .grid {
	padding-block:1.2rem;
	border-bottom:none;
	transition:.5s;
}
HEADER.header--scrolled .grid IMG {
	max-width:180px;
}

BODY {
	background-color:var(--darkGrey);
	font-family:var(--font1);
	color:white;
}

STRONG {
	font-weight:700 !important;
}

H1,H2,H3,H4 {
	font-family:"Red Hat Display", sans-serif;
}

LABEL.input-wrapper.input-wrapper--active SPAN {
	opacity:0.5 !important;
}
INPUT[type='checkbox'] {
	width:0px;
	position:relative;
}
INPUT[type='checkbox']:after {
	content:'';
	position:absolute;
	height: 20px;
	width: 20px;
	left: -1px;
	top:-5px;
	background-color: var(--lightBlue);
	border:1px solid var(--grey);
	border-radius: 4px;
	z-index: 100;
}
INPUT[type='checkbox']:before{
	content:'';
	position:absolute;
	height: 12px;
	width: 12px;
	left: 3px;
	top:-1px;
	background-color: var(--green);
	border-radius: 2px;
	z-index: 1000;
	display:none;
}
INPUT[type='checkbox']:checked:before  {
	display:block;
}
.font--2 {
	font-family:var(--font2);
}

.font--1 {
	font-family:var(--font2);
}
P A:not(.px-5) {
	color:var(--green);
	font-weight:600;
}

.gradient--bottom:after {
	position:absolute;
	content:'';
	background: linear-gradient(to top, rgba(2, 28, 34, 1), rgba(2, 28, 34, 0));
	height:120px;
	width:100%;
	bottom:0px;
	left:0px;
	transition:.4s;
}
.gradient--left:after {
	position:absolute;
	content:'';
	background: linear-gradient(to right, rgba(2, 28, 34, 1), rgba(2, 28, 34, 0));
	height:100%;
	width:50%;
	bottom:0px;
	left:0px;
	transition:.4s;
}

/* Content */
.text-image-row H3, .text-image-row H4{
	font-size:2.5rem;
	margin-bottom:2rem;
	font-weight:800;
	line-height:1.2em;
}	
.text-image-row--benefits H3, .text-image-row--benefits H4{
	font-size:3rem;
	margin-bottom:1rem;
	font-weight:800;
	line-height:1.2em;
}

.list-section UL {
	padding-block:2rem;
}

.list-section UL LI, .page-content UL LI {
	position:relative;
	padding:0px 0px 0px 30px;
	margin-block:8px;
}
.list-section UL LI STRONG, .page-content UL LI STRONG {
	color:var(--green);
}
.list-section UL LI:before, .page-content UL LI:before {
	content:'';
	position:absolute;
	height:12px;
	width:12px;
	border-radius:50%;
	background-color:var(--green);
	left:0px;
	top:10%;
}
.blog-tab:hover:after {
	height:200px;
}
.coaching-detail-content H4, .coaching-detail-content H3 {
	font-weight:700;
	font-size:1.8rem;
}
.trackman-container H3 {
	font-size:3rem;
	font-weight:700;
	margin-bottom:2rem;
}

/* Transition Section */
.transition-section {
	transition: all 0.6s ease;
	opacity: 0;
	transform:translateY(60px);
}
.transition-section--slow {
	transition: all 1s ease;
	transition-delay: 0.5s;
}
.transition-section--visible {
	opacity: 1;
	transform:translateY(0px);
}

/* Service Grid */
.service-tab:hover IMG {
	transform:scale(1.1);
}

/* Select dropdwown styling */
.select .select__dropdown LI {
	opacity:0;
	padding-block:5px;

}
.select .select__text:before {
	position:absolute;
	content:'';
	width: 0; 
  	height: 0; 
  	border-left: 7px solid transparent;
  	border-right: 7px solid transparent;
  	border-top: 10px solid var(--green);
  	right:0px;
  	top:10px;
  	transition:.3s;
}
.select.select--open {
	max-height:none;
	border-radius:10px;
}

.select.select--open .select__text:before {
	transform:rotate(-180deg);
}

.select.select--open .select__dropdown LI {
	opacity:1;
	transition:.4s;
}
.page-content H2, .page-content H3, .page-content H4, .page-content H5  {
	font-weight:800;
	margin-bottom:1.5rem;
	line-height: 1.2;
}
.page-content H2 {
	font-size:2.5rem;
}
.page-content H3 {
	font-size:2rem;
}
.page-content H4 {
	font-size:1.75rem;
}
.page-content H5 {
	font-size:1.5rem;
}
.page-content A:not(.px-5) {
	color:var(--green);
	font-weight:600;
}

/* Mobile Navigation */
#mobileNavToggle.nav-toggler--selected DIV {
	width:30px;
}
#mobileNavToggle.nav-toggler--selected DIV:last-of-type {
	display:none;
}
#mobileNavToggle.nav-toggler--selected DIV:first-of-type {
	transform:rotate(45deg);
	top:10px;
}
#mobileNavToggle.nav-toggler--selected DIV:nth-of-type(2){
	transform:rotate(-45deg);
}
#mobileNavigation {
	transition:.5s;
}
#mobileNavigation.mobile-nav--open {
	left:0px;
}

/* Glide */
.glide__bullets .glide__bullet.glide__bullet--active {
	background-color:white;
}

/* Media Queries */
@media screen and (max-width:1024px) {
	.list-section UL {
		padding-block:1.2rem;
	}
}
@media screen and (max-width:640px) {
	.page-content H2, .page-content H3, .page-content H4, .page-content H5  {
		margin-bottom:1rem;
	}
	.page-content H2 {
		font-size:1.75rem;
	}
	.page-content H3 {
		font-size:1.5rem;
	}
	.page-content H4 {
		font-size:1.25rem;
	}
	.page-content H5 {
		font-size:1.25rem;
	}
	.text-image-row H3, .text-image-row H4{
		font-size:1.9rem;
		margin-bottom:1rem;
	}
}
/*@media screen and (min-width:px) {
	.text-image-row H3, .text-image-row H4{
		font-size:1.5rem;
		margin-bottom:1rem;
	}
}
*/