@import "@{parenturl}/less/mixins.less";
@import "@{themeurl}/less/vars.less";

.button {
	display:block;
	width:fit-content;
	.margin-sides(auto);
	padding:1em 1.5em;
	.font(Poppins, 500, 18px);
	letter-spacing:.05em;
	text-align:center;
	text-transform:uppercase;

	border:1px solid @green;
	background-color:@green;
	color:#fff;
	.hover();
	&:hover {
		background-color:fade(@green, 0);
		color:@green;
	}
}

#before-footer {
	background-image:url('/wp-content/uploads/2023/08/footer.jpg');
	min-height:640px;
	> div {
		max-width:1600px;
		.padding-ends(3vw);
		display:grid;
		grid-gap:25px;
		@media (min-width:769px) {
			grid-template-columns:auto 1fr auto;
			grid-auto-flow:column;
			#contact-us {
				grid-column:3;
				grid-row:1 / span 4;
			}
		}
	}
	#footer-logo {
		line-height:0;
		margin-bottom:40px;
		a { display:block; }
		svg {
			* {
				fill:#fff;
			}
		}
	}
}

#footer-info {
	display:grid;
	.min({ grid-template-columns:auto 1px auto; }, 960);
	.max({ grid-template-rows:auto 1px auto; }, 960);
	justify-items:start;
	grid-gap:25px;
	margin-bottom:25px;
	hr {
		color:#fff;
		margin:0;
		width:100%;
		height:100%;
	}
}

.footer-info {
	color:#fff;
	.font(Poppins, 400, 18px);
	letter-spacing:.05em;
	padding:10px;
	.vertAlign;
	gap:.5em;
	svg {
		height:2em;
		fill:@green;
	}	
}

#social-media {
	margin-bottom:40px;
	h5 {
		color:#fff;
		.font(Poppins, 600, 18px);
		margin-bottom:10px;
		text-transform:uppercase;
	}
	div {
		display:inline-grid;
		grid-gap:15px;
		grid-auto-flow:column;
		a {
			display:block;
			line-height:0;
			font-size:36px;
			color:@green;
			&:hover { color:#fff; }
			svg {
				fill:currentcolor;
				height:1em;
				width:auto;
			}
		}
	}
}

:root {
	--wpcf7-text-color: #393939;
	--wpcf7-inputting-text-color: #393939;
	--wpcf7-background-color: #fff;
	--wpcf7-border-color: @blue;
}
#contact-us {
	--wpcf7-text-color: #fff;
	--wpcf7-inputting-text-color: #efefef;
	--wpcf7-background-color: #fff;
	--wpcf7-border-color: #fff;
	
	h5 {
		color:#fff;
		.font(Poppins, 500, 32px);
		margin-bottom:0;
		text-align:center;
		text-transform:uppercase;
	}
	
}

/**** Full BORDER Color ****/
.wpcf7 .better-input {
	.wpcf7-form-control-wrap {
		position: relative;
		background-color:none;
		border:none;
		border-bottom:1px solid var(--wpcf7-border-color);
		display:block;
		margin-top: 1.75em;
		color:var(--wpcf7-text-color);
		.font(Montserrat, 400, 16px);
	}
	.notBetterInput {
		margin-top:25px;
		.wpcf7-form-control-wrap {
			border-bottom:0;
			margin-top:7px;
		}
		label {
			color:var(--wpcf7-text-color);
			.font(Montserrat, 400, 16px);
		}
	}
	.betterInput {
		.inherit();
		.font();

		*::placeholder { color: rgba(0,0,0,0.7); opacity: 1; }
		*:-ms-input-placeholder { color: rgba(0,0,0,0.7); }
		*::-ms-input-placeholder { color: rgba(0,0,0,0.7); }
		*:-moz-input-placeholder { color: rgba(0,0,0,0.7); }
		*::-moz-input-placeholder { color: rgba(0,0,0,0.7); }

		* {
			color:inherit;
			border:0;
			padding: 1px 2px;
			// background: transparent;
			resize:none;
		}
		label {
			.transition();
		}

		input, select, textarea {
			color:inherit;
			font-size:inherit;
			font-weight:inherit;
			font-family:inherit;
			padding:.8em .4em;
			width:100%;
			&:focus {
				outline:none;
			}
		}
		textarea {
			height:100px;
			resize:none;
		}
		select {
			display:block;
			width:100%;
			margin-bottom:5px;
		}

		label {
			position: absolute;
			width:100%;
			top:0;
			.translateX(.4em);
			.translateY(.8em);
			left:0;
			pointer-events: none;
			color:inherit;
			font-size:inherit;
			font-weight:inherit;
			font-family:inherit;
		}
		.req {
			color:#FF4136;
			.transition(.3s, color, @easing);
		}

		*:focus:not(:placeholder-shown) + label,
		*:focus + label,
		*:focus:not(:placeholder-shown) + label .req,
		*:focus + label .req {
			color:var(--wpcf7-inputting-text-color); // Inputting
			display: none;
		}
		*:not(:placeholder-shown) + label,
		*:not(:placeholder-shown) + label .req {
			color:#ddd; // Inputted
			display: none;
		}
		*:focus + label,
		*:not(:placeholder-shown) + label {
			.translateY(-1.3em);
			font-size: .8em;
			display:none;
		}
	}
	input[type="submit"] {
		display:block;
		margin:25px 0 0;
		width:100%;
		padding:1em 1.5em;
		.font(Poppins, 500, 18px);
		letter-spacing:.05em;
		text-align:center;
		text-transform:uppercase;

		border:1px solid @green;
		background-color:@green;
		color:#fff;
		.hover();
		&:hover {
			background-color:fade(@green, 0);
			color:@green;
		}
	}
}

#footer {
	background-color:#414042;
	padding:25px 50px 15px;
	
	> * {
		.max-width(1400px);
		&:not(:last-child) {
			margin-bottom:25px;
		}
	}
	ul.footer-menu {
		display:grid;
		.min({ grid-template-columns:1fr 2fr 1fr; });
		grid-gap:25px;
		> li > a {
			display:inline-block;
			.font(Poppins, 500, 1.25em);
			text-transform:uppercase;
			pointer-events:none;
			margin-bottom:.25em;
		}
		> li:nth-child(2) ul {
			column-count:2;
			column-width:240px;
			column-gap:25px;
		}
		ul.sub-menu {
			margin-left:10px;
		}
	}
}

.npoo {
	border:1px solid @blue;
	border-radius:35px;
	padding:50px 25px;
	.green { color:@green; }
	.blue { color:@blue; }
	.size-24 { font-size:1.33em; }
	.size-27 { font-size:1.5em; }
	b.semi { font-weight:600; }
	b.medium { font-weight:500; }
	h4 {
		.font(Poppins, 500, 32px);
		margin-bottom:15px;
		text-align:center;
		text-transform:uppercase;
	}
	p {
		color:#6D6E71;
		.font(Poppins, 400, 18px, 1.25);
		margin-bottom:0;
		text-align:center;
	}
	.wpcf7 .better-input input[type="submit"] {
		width:fit-content;
		.margin-sides(auto);
	}
}

.video-center {
	max-width:720px;
}

#footer-links {
	display:grid;
	grid-auto-flow:column;
	position:sticky;
	bottom:0;
	z-index:100;
	background-color:fade(#fff, 90);
	.min({display:none !important;});
	a {
		display:block;
		color:#fff;
		padding:5px;
		.bold();
		text-align:center;
		text-transform:uppercase;
		svg {
			fill:currentcolor;
			display:block;
			margin:0 auto 5px;
			font-size:2em;
			height:16px;
			width:auto;
		}
		&:nth-child(odd) { background-color:#17539b; }
		&:nth-child(even) { background-color:#74B04B; }
	}
}