
:root {
	--cp-pink: #e91d8f;
	--cp-black: #010101;
	--cp-grey: #efeff0;
	--cp-glass-gradient: linear-gradient(-25deg, black 50%, #181818 50%, #333);
	
	/* Metallic Gold */
	--grad-gold: linear-gradient(135deg, #FFD700 0%, #FFA500 25%, #FFD700 50%, #FFFFFF 75%, #FFD700 100%);
	
	/* Metallic Silver */
	--grad-silver: linear-gradient(135deg, #C0C0C0 0%, #FFFFFF 25%, #C0C0C0 50%, #808080 75%, #C0C0C0 100%);
	
	/* Metallic Bronze */
	--grad-bronze: linear-gradient(135deg, #CD7F32 0%, #A0522D 25%, #CD7F32 50%, #DAA520 75%, #CD7F32 100%);
	
	/* Metallic Light Blue */
	--grad-blue: linear-gradient(135deg, #87CEEB 0%, #B0E0E6 25%, #87CEEB 50%, #FFFFFF 75%, #87CEEB 100%);
}


strong.logo-treatment { font-size: 125%; >span { color: var(--cp-pink)}}

#black-band {
	color: white;
	font-weight: bold;
	padding-top: 0.5rem; padding-bottom: 0.5rem;
	> div:first-child { text-align: center}
	img { max-width: 420px; margin-left: auto; margin-right:auto; }
	#logo-descriptor { font-size: 1.5em; }
}
#black-band:before {
	background: black;
	position: absolute;
	z-index: -1;
	content: '';
	left: 1rem; height: 100%;
	right: 1rem;
	
}
.droplets-bg-wrapper {
	background: url(/wp-content/themes/gt/lib/images/bg-water-droplets-dark.jpg) no-repeat 50%;
	background-size:cover;
	padding: 4rem 0;
	color: white;
	text-transform: uppercase;
	h3 {
		font-size: 2.5em;
		border-bottom: solid 4px var(--theme-orange);
		display: inline-block;
		padding: 0 1rem 8px;
		margin-bottom: 4rem; 
		> span { display: block; }
		> span:not(.sm) { margin-bottom: 0.5rem; }
		> span.sm { line-height:1; font-family: var(--theme-font); font-weight: bold; font-size: 66%;}
	}
	p { margin: 0; }
	a.btn:not(:hover) { color: white !important; }
	ul {
		list-style: none;
		margin: 0 0 3rem;
		padding: 0;
		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
		column-gap: 3rem;
		row-gap: 3rem;
		align-content: center;
		justify-content: space-between;
		> li {
			margin: 0; padding: 0;
			flex-grow: 1;
			min-width: calc(33.32% - 3rem);
			position: relative;
			padding-top: 18%;
			font-size: 1.125em;
			font-weight: bold;
			border-radius: 10px;
			backdrop-filter: brightness(1.5) contrast(0.85);
			> span {
				display: block;
				position: absolute;
				left: 0;
				right: 0;
				top: 50%;
				transform: translateY(-50%);
				padding: 0 2rem;
			}
		}
	}

}
@media(max-width:991px) {
	.droplets-bg-wrapper h3 { margin-bottom: 2rem; }
	.droplets-bg-wrapper ul {
		row-gap: 2rem;
		column-gap: 2rem;
		> li {
			min-width: calc(50% - 2rem) !important;
		}
	}
}
@media(max-width:767px) {
	.droplets-bg-wrapper ul {
		display: block;
		> li {
			min-width: unset !important;
			margin-bottom: 1rem;
			padding-top: 25%;
		}
	}
}

section#packages {
	padding: 4rem 0;
	background: var(--cp-gray);
	h3 {
		font-size: 2rem;
		text-transform: uppercase;
		width: auto;
		margin-left: auto;
		margin-right:auto;
		display: inline-block;
		text-align: center;
		padding: 0 0.5rem 6px;
		border-bottom: solid 4px var(--theme-orange);
	}
	.packages {
		display: flex;
		flex-direction: row;
		column-gap: 1rem;
		row-gap: 1rem;
		flex-wrap: wrap;
		margin-bottom: 1rem;
		
		> .pkg {
			flex-grow: 1;
			background: white;
			border-radius: 10px;
			max-width: calc(25% - 0.75rem);
			padding:1.5rem 1rem;
		}
		.include { font-weight: bold; margin-bottom: 1rem; }
		ul { list-style: none; margin: 0; padding: 0; line-height: normal; }
		ul > li { margin-bottom: 0.5rem; border-top: solid 1px var(--cp-grey); padding-top: 0.5rem; }
		h4 { position: relative; font-family: var(--theme-alt-font); font-size: 120%; text-transform: uppercase; font-weight: normal !important; letter-spacing: 1px;}
		h4 + p { font-size: 0.875em; }
		.pkg h4:after { content: ''; display: block; height: 3px; margin-top: 4px; background: gray; }
		.pkg.gold h4:after { background: var(--grad-gold)}
		.pkg.silver h4:after { background: var(--grad-silver)}
		.pkg.bronze h4:after { background: var(--grad-bronze)}
		.pkg.sport h4:after { background: var(--grad-blue)}
	}
}
@media(max-width:991px) {
	section#packages {
		.packages > .pkg { min-width: calc(50% - 0.75rem) }
		
	}
}
@media(max-width:767px) {
	section#packages {
		.packages {
			display: block;
			> .pkg { flex: unset; min-width: 100%; margin-bottom: 1rem; }
		}
	}
}

.add-ons {
	display: flex;
	column-gap: 1rem;
	margin-bottom: 3rem;
	row-gap: 1rem;
	justify-content: center;
	> div:first-child { flex: 0.25;  }
	> div {
		text-align: center;
		display: flex;
		flex: 1;
		align-items: center;
		flex-direction: column;
		background: white;
		border-radius: 10px;
		padding: 1rem;
	
		
		h6 { margin: 0; font-family: var(--theme-alt-font); font-weight: 400 !important; font-size: 120%; line-height:1.875 }
		
	}
	
}
@media(max-width:991px) {
	.add-ons {
		flex-wrap: wrap;
		> div { flex: unset; min-width: 100%;}
		> div:first-child { background: unset; }
	}
}