body {
	--sectionPad:clamp(1rem, min(8vh, 4vw), 8rem);
	--primeColor:#F8FAFC;
	--pureColor:#FFF;
	--midColor:#68A;
	--flowColor:#123;
	--altColor:#05C;
	--altColorTransparent:#05AB;
	--altColorHover:#038;
	--selectionColor:#FFF3;
	--hoverColor:#FFF1;
	--highlightColor:#CDF;
	--focusColor:#08F;
	--shadowColor:#0004;
	--outlineColor:#0248;
	--primeSelection:#0484;
	--gradientStart:#05C;
	--gradientEnd:#507;
}

html {
	scroll-behavior: smooth;
}

html,body,div,p,h1,h2,h3,h4,h5,h6,
ul,ol,li,dl,dt,dd,form,fieldset,caption,legend,
table,tr,td,th,address,blockquote,img {
	margin:0;
	padding:0;
}

img, fieldset {
	border:none;
}

blockquote, q {
	quotes:none;
}

body *, *:after, *:before {
	box-sizing:border-box;
}

button, label, summary {
	cursor:pointer;
}

html, body {
	height:100%;
}

input[hidden] {
	display:block;
	position:absolute;
	left:-200vw;
}

.d-none {
	display: none;
}

body, button, input, table, textarea, select {
	font-size:1rem;
	line-height:1.5;
	font-family:poppins,arial,helvetica,sans-serif;
}

body {
	background:var(--primeColor);
	color:var(--flowColor);
}

input:focus,
select:focus,
textarea:focus,
button:focus {
	outline:none;
	box-shadow:0 0 0.25rem 0.125rem var(--focusColor);
}

.instagram-icon:before {
	margin:-0.25rem 0.75rem 0 0;
	content: "";
	display: inline-block;
	background-repeat: no-repeat;
	background-size: contain;
	width: 28px;
	height: 28px;
	background-image: url("../images/social/instagram.svg");
}

.linkedin-icon:before {
	margin:-0.25rem 0.75rem 0 0;
	content: "";
	display: inline-block;
	background-repeat: no-repeat;
	background-size: contain;
	width: 24px;
	height: 28px;
	background-image: url("../images/social/linkedin.svg");
}

#pricing li:before {
	margin:-0.25rem 0.75rem 0 0;
	content: "";
	display: inline-block;
	background-repeat: no-repeat;
	background-size: contain;
	width: 28px;
	height: 28px;
	background-image: url("../images/pricing/check.svg");
}

#top {
	scroll-behavior:smooth;
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	/*overflow:auto;*/
}

#top > header,
#top > footer,
main > section,
main > div > section {
	max-width:78rem;
	margin:0 auto;
	padding:var(--sectionPad) clamp(0.5rem, 2vw, 2rem);
}

main > section + section {
	padding-top:0;
}

main > div {
	background:
		var(--altColor)
		linear-gradient(135deg, var(--gradientStart) 0%, var(--gradientEnd) 75%);
	color:var(--primeColor);
}

#top > header {
	display:flex;
	--sectionPad:clamp(1rem, min(5vh, 3vw), 2rem);
}

#top > header a,
.onPageLinks a,
.socialLinks a {
	text-decoration:none;
	color:var(--flowColor);
}

h1,
.icon_logo {
	font-size:1.25rem;
	line-height:2;
}

h1 span {
	color:var(--altColor);
}

#mainMenu {
	flex-grow:1;
	padding-left:1.5rem;
}

#mainMenu li {
	float:left;
	list-style:none;
	margin-left:1rem;
}

#mainMenu li.alternate {
	float:right;
}

#mainMenu li a,
.onPageLinks a {
	display:inline-block;
	padding:0.5rem 1rem;
	border-radius:1.25rem;
	transition:background 0.3s;
}

#mainMenu li a:focus,
#mainMenu li a:hover,
.onPageLinks a:focus,
.onPageLinks a:hover {
	background:var(--highlightColor);
}

#mainMenu li.featured a {
	font-weight:bold;
	background:var(--altColor);
	color:var(--primeColor);
}

#mainMenu li.featured a:focus,
#mainMenu li.featured a:hover {
	background:var(--altColorHover);
}

footer {
	width:100%;
}

footer h2,
.onPageLinks,
main {
	text-align:center;
}

.onPageLinks {
	margin:2rem 0 4rem;
}

.onPageLinks li {
	display:inline;
	list-style:none;
	margin:0 1rem;
}

footer p {
	float:left;
	font-size: 12px;
}

.socialLinks {
	text-align:right;
}

.socialLinks li {
	display:inline;
	margin-left:0.5rem;
}

.socialLinks a {
	position:relative;
	display:inline-block;
}

.socialLinks a:before {
	font-size:3em;
	transition:transform 0.3s;
	background-position:center;
	color:var(--altColor);
}

.socialLinks a:hover:before {
	transform:scale(1.2);
}

.socialLinks a span {
	position:absolute;
	left:-200vw;
	top:-3.6em;
	padding:0.5em 1em;
	background:var(--highlightColor);
	border:0.0625rem solid var(--altColor);
	border-radius:0.5em;
	opacity:0;
	transform:translateX(-50%) scale(0.1);
	transition:left 0s 0.5s, opacity 0.5s, transform 0.5s;
}

.socialLinks a:focus span,
.socialLinks a:hover span {
	left:50%;
	opacity:1;
	transform:translateX(-50%) scale(1);
	transition:opacity 0.5s, transform 0.5s;
}

.modal,
.modal > .modalClose {
	display:block;
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

.modal > .modalClose,
#mainMenu > .modalClose {
	background-image:linear-gradient(135deg, rgba(0,64,128,0.8) 25%, rgba(64,0,96,0.8) 75%);
}

.modal {
	display:flex;
	left:-100vw;
	overflow:auto;
	opacity:0;
	transition:left 0s 0.5s, opacity 0.5s;
}

.modal:target {
	left:0;
	opacity:1;
	transition:opacity 0.5s;
}

.modal > div {
	display:flex;
	flex-direction:column;
	justify-content:center;
	padding:clamp(1rem, 4vw, 2rem);
	margin:auto 0;
	position:relative;
	left:-50%;
	min-height:100%;
	background:var(--primeColor);
	box-shadow:0 0 2rem 1rem var(--shadowColor);
	transition:left 0.5s;
}

.modal:target > div {
	left:0;
}

.modal h2,
.modal p {
	margin-bottom:1rem;
}

.modal label {
	display:block;
	text-indent:0.5em;
}

.modal input,
.modal select,
.modal textarea {
	width:100%;
	padding:0.5em;
	margin:0.125em 0 1em;
	border:0.0625em solid var(--altColor);
	border-radius:0.5em;
}

.modal footer {
	padding-top:1em;
}

form.modal footer button {
	width:100%;
	padding:0.75em;
	font-weight:bold;
	border:none;
	border-radius:1.5em;
	background:var(--altColor);
	color:var(--primeColor);
	transition:background 0.3s;
}

form.modal footer button:focus,
form.modal footer button:hover {
	background:var(--altColorHover);
}

.modalClose {
	text-decoration:none;
}

.modalClose.icon_logo {
	display:block;
	position:relative;
	margin-bottom:2em;
	font-weight: bold;
	color:var(--flowColor);
}

.modalClose.icon_logo:after {
	position:absolute;
	top:0;
	right:0;
	font-size:1.5rem;
}

h2 span,
.icon_logo span {
	display:inline-block; /* acts as keep-together */
	color:var(--altColor);
}

main > div h2 span {
	color:var(--primeColor);
}

main section h2 {
	font-size:clamp(1.5rem,6vw,3rem);
	font-weight:normal;
	line-height:1.2;
	padding-bottom:2rem;
}

main header h2,
main header p {
	max-width:40rem;
	margin:0 auto;
}

.banner {
	max-width:64rem;
	margin:0 auto;
	padding-bottom:4rem;
}

.banner h2 {
	font-size:clamp(2.5rem,7vw,4.5rem);
}

.banner h2 span {
	display:inline-block;
	padding-bottom:0.25em;
	margin-bottom:-0.25em;
	background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 418 42' preserveAspectRatio='none'%3E%3Cpath d='M203.371.916c-26.013-2.078-76.686 1.963-124.73 9.946L67.3 12.749C35.421 18.062 18.2 21.766 6.004 25.934 1.244 27.561.828 27.778.874 28.61c.07 1.214.828 1.121 9.595-1.176 9.072-2.377 17.15-3.92 39.246-7.496C123.565 7.986 157.869 4.492 195.942 5.046c7.461.108 19.25 1.696 19.17 2.582-.107 1.183-7.874 4.31-25.75 10.366-21.992 7.45-35.43 12.534-36.701 13.884-2.173 2.308-.202 4.407 4.442 4.734 2.654.187 3.263.157 15.593-.78 35.401-2.686 57.944-3.488 88.365-3.143 46.327.526 75.721 2.23 130.788 7.584 19.787 1.924 20.814 1.98 24.557 1.332l.066-.011c1.201-.203 1.53-1.825.399-2.335-2.911-1.31-4.893-1.604-22.048-3.261-57.509-5.556-87.871-7.36-132.059-7.842-23.239-.254-33.617-.116-50.627.674-11.629.54-42.371 2.494-46.696 2.967-2.359.259 8.133-3.625 26.504-9.81 23.239-7.825 27.934-10.149 28.304-14.005.417-4.348-3.529-6-16.878-7.066Z' fill='%230088FF66'%3E%3C/path%3E%3C/svg%3E") center bottom no-repeat;
	background-size:100% 50%;
}

main header p,
.banner p,
.headerless p {
	font-size:1.125rem;
}

.banner p,
.headerless p,
section > header p {
	max-width:38em;
	margin:0 auto 2rem;
}

.actions li {
	list-style:none;
	display:inline;
}

.actions a,
.action {
	display:inline-block;
	padding:0.25em 0.75em;
	margin:0 0.5rem;
	text-decoration:none;
	color:var(--flowColor);
	border:0.125rem solid var(--midColor);
	border-radius:1em;
	transition:background 0.3s;
}

.action {
	display:block;
	width:100%;
	max-width:24em;
	margin:2rem auto;
	padding:0.5em 0.75em;
	font-size:1.25em;
	font-weight:bold;
	letter-spacing:0.0625em;
	border-radius:1.25em;
}

.actions a:focus,
.actions a:hover,
.action:focus,
.action:hover {
	background:var(--highlightColor);
}

.actions .featured a {
	font-weight:bold;
	background:var(--altColor);
	border-color:var(--altColor);
	color:var(--primeColor);
}

.actions .featured a:focus,
.actions .featured a:hover {
	background:var(--altColorHover);
}

main > div .actions a,
main > div .action {
	background:var(--primeColor);
	color:var(--flowColor);
}

#companies h2 {
	padding-bottom:1rem;
	font-size:1rem;
	color:var(--altColor);
}

#companies li {
	display:inline-block;
	list-style:none;
	margin:0 0.75em 1rem;
	font-size:1.25em;
	line-height:2em;
	font-weight:bold;
}

#companies li:before {
	font-size:2em;
	margin-right:0.5rem;
	color:var(--flowColor);
}

#features {
	max-width:100%;
	padding-right:0;
	display:grid;
	grid-template-areas:
		"features_header features_header"
		"features_labels features_images";
	grid-template-columns:50% 50%;
}

#features > header {
	grid-area:features_header;
}

#features h3 {
	margin-bottom:0.25rem;
	font-size:1.25em;
}

#features > div {
	grid-area:features_labels;
	padding:0.5em 0;
}

#features article {
	position:relative;
	max-width:40em;
	padding:1.5rem 4em 1.5em 2em;
	margin:0.5rem 0 0.5rem auto;
	text-align:left;
	border-radius:1rem 0 0 1rem;
}

#features article:before {
	position:absolute;
	top:50%;
	right:1.5rem;
	transform:translateY(-50%);
	content: "";
	display: inline-block;
	background-repeat: no-repeat;
	background-size: contain;
	width: 25px;
	height: 50px;
	background-image: url("../images/features/caret.svg");
}

#features article label,
#motivationTools article label {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

#features article:hover {
	background:var(--hoverColor);
}

#features input:nth-of-type(1):checked ~ div article:nth-of-type(1),
#features input:nth-of-type(2):checked ~ div article:nth-of-type(2),
#features input:nth-of-type(3):checked ~ div article:nth-of-type(3),
#features input:nth-of-type(4):checked ~ div article:nth-of-type(4) {
	background:var(--selectionColor);
}

#features input:nth-of-type(1):checked ~ div article:nth-of-type(1)::before,
#features input:nth-of-type(2):checked ~ div article:nth-of-type(2)::before,
#features input:nth-of-type(3):checked ~ div article:nth-of-type(3)::before,
#features input:nth-of-type(4):checked ~ div article:nth-of-type(4)::before {
	transition-property: all;
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
	transition-duration: 50ms;
	right:1rem;
	filter: brightness(0) invert(1);
}

#features aside {
	flex-shrink:1;
	position:relative;
	overflow:hidden;
	grid-area:features_images;
	/*background:var(--primeColor);*/
	/*border:2em solid var(--primeColor);*/
	border-radius:1rem 0 0 1rem;
}

#features aside img {
	position:absolute;
	top:0;
	left:-200vw;
	width:auto;
	height:100%;
	opacity:0;
	transition:left 0s 0.5s, opacity 0.5s;
}

#features input:nth-of-type(1):checked ~ aside img:nth-of-type(1),
#features input:nth-of-type(2):checked ~ aside img:nth-of-type(2),
#features input:nth-of-type(3):checked ~ aside img:nth-of-type(3),
#features input:nth-of-type(4):checked ~ aside img:nth-of-type(4) {
	left:0;
	opacity:1;
	transition:opacity 0.5s;
}

#motivationTools > div {
	display:flex;
	flex-wrap:wrap;
	gap:2rem;
	text-align:left;
}

#motivationTools article {
	position:relative;
	flex-grow:1;
	width:26%;
	min-width:min(100%, 15em);
	padding: 20px;
	margin-bottom: 20px;
}

#motivationTools h3 {
	margin-bottom:1rem;
	line-height:2em;
}

#motivationTools h3:before {
	margin-right:1rem;
}

#motivationTools input:nth-of-type(1):checked ~ div article:nth-of-type(1) .features-icon::before,
#motivationTools input:nth-of-type(2):checked ~ div article:nth-of-type(2) .features-icon::before,
#motivationTools input:nth-of-type(3):checked ~ div article:nth-of-type(3) .features-icon::before {
	filter: grayscale(0);
}

#motivationTools input:nth-of-type(1):checked ~ div article:nth-of-type(1),
#motivationTools input:nth-of-type(2):checked ~ div article:nth-of-type(2),
#motivationTools input:nth-of-type(3):checked ~ div article:nth-of-type(3),
#motivationTools div article:hover {
	box-shadow: 0 0.125em 0.375em var(--shadowColor);
	background-color: var(--pureColor);
}

#motivationTools input:nth-of-type(1):checked ~ div article:nth-of-type(1)::before,
#motivationTools input:nth-of-type(2):checked ~ div article:nth-of-type(2)::before,
#motivationTools input:nth-of-type(3):checked ~ div article:nth-of-type(3)::before,
#motivationTools div article:hover::before {
	content: "";
	width: 0;
	height: 0;
	border-bottom: 40px solid var(--pureColor);
	border-left: 40px solid transparent;
	transform: rotate(45deg);
	position: absolute;
	bottom: -20px;
	box-shadow: 0 0.125em 0.375em var(--shadowColor);
	z-index: 1;
}

#motivationTools input:nth-of-type(1):checked ~ div article:nth-of-type(1)::after,
#motivationTools input:nth-of-type(2):checked ~ div article:nth-of-type(2)::after,
#motivationTools input:nth-of-type(3):checked ~ div article:nth-of-type(3)::after,
#motivationTools div article:hover::after {
	content: "";
	position: absolute;
	background-color: var(--pureColor);
	width: 80px;
	height: 30px;
	bottom: 0;
	margin-left: -20px;
	z-index: 1;
}

#motivationTools input:nth-of-type(1):checked ~ div article:nth-of-type(1)::before,
#motivationTools input:nth-of-type(1):checked ~ div article:nth-of-type(1)::after,
#motivationTools div article:nth-of-type(1):hover::before,
#motivationTools div article:nth-of-type(1):hover::after {
	left: 20px;
}

#motivationTools input:nth-of-type(2):checked ~ div article:nth-of-type(2)::before,
#motivationTools input:nth-of-type(2):checked ~ div article:nth-of-type(2)::after,
#motivationTools div article:nth-of-type(2):hover::before,
#motivationTools div article:nth-of-type(2):hover::after {
	left:0;
	right:0;
	margin-left:auto;
	margin-right:auto;
}

#motivationTools input:nth-of-type(3):checked ~ div article:nth-of-type(3)::before,
#motivationTools input:nth-of-type(3):checked ~ div article:nth-of-type(3)::after,
#motivationTools div article:nth-of-type(3):hover::before,
#motivationTools div article:nth-of-type(3):hover::after {
	right: 20px !important;
}

#motivationTools aside {
	display:flex;
	width:100%;
	overflow:hidden;
}

#motivationTools aside img {
	flex-shrink:0;
	border-radius: 5px;
	position:relative;
	display:block;
	width:100%;
	height:auto;
	left:0;
	transition:left 0.5s;
}

#motivationTools input:nth-of-type(2):checked ~ aside img {
	left:-100%;
}

#motivationTools input:nth-of-type(3):checked ~ aside img {
	left:-200%;
}

#testimonials,
#pricing,
#faq {
	display:flex;
	flex-wrap:wrap;
	gap:2rem;
}

#testimonials header,
#pricing header,
#faq header {
	width:100%;
}

#testimonials blockquote,
#pricing article,
#faq article {
	flex-grow:1;
	display:flex;
	flex-direction:column;
	width:20em;
	min-width:min(100%, 20em);
	padding:2rem;
}

#testimonials blockquote {
	text-align:left;
	background:var(--pureColor);
	box-shadow:0 0.125em 0.375em var(--shadowColor);
	border-radius:1rem;
	background-image: url("../images/testimonials/quotes.svg");
	background-size: 120px 120px;
	background-repeat: no-repeat;
	background-position: left 15px top 0px;
}

#testimonials blockquote > p {
	flex-grow:0;
	font-size:1.125em;
	padding-bottom:1rem;
}

#testimonials blockquote > footer {
	flex-grow:0;
	position:relative;
	padding-right:5em;
}

#testimonials blockquote > p:last-of-type {
	flex-grow:1;
}

#testimonials blockquote > footer img {
	position:absolute;
	bottom:0;
	right:0;
	height:4em;
	width:auto;
	border-radius:50%;
	transition:transform 0.3s;
	box-shadow:
		0 0 0 0.125em var(--outlineColor);
}

#testimonials blockquote > footer img:hover {
	transform:scale(1.5);
}

#pricing article {
	width:20em;
	border-radius:2rem;
}

#pricing .featured {
	background:var(--altColor);
	box-shadow:0.25em 0.25em 0.75em var(--shadowColor);
}

#pricing h3 {
	margin-bottom:1rem;
	font-size:2em;
	font-weight:normal;
	line-height:1.2;
}

#pricing h3 span {
	display:block;
	font-size:3rem;
}

#pricing ul {
	max-width:20em;
	margin:0 auto;
}

#pricing li {
	list-style:none;
	font-size:0.875rem;
	text-align:left;
	margin-top:2rem;
	display: flex;
}

#faq {
	justify-content:center;
	text-align:left;
}

#faq > header > h2 {
	margin:0;
	max-width:100%;
}

#faq > header p {
	margin:0 0 1.5rem;
}

#faq article {
	max-width:24em;
	padding:0;
}

#faq article > * {
	margin-bottom:1rem;
}

@media (max-width:66em) {
	#companies ul {
		max-width:32em;
		margin:0 auto;
	}
}

@media (max-width:56em) {
	h1 {
		flex-grow:1;
	}
	.openMainMenu {
		display:block;
		margin-left:1rem;
	}
	#mainMenu,
	#mainMenu > .modalClose {
		display:block;
		position:absolute;
		top:0;
		left:0;
		width:100%;
		height:100%;
	}
	#mainMenu {
		position:fixed;
		left:-200vw;
		padding:0;
		display:flex;
		overflow:auto;
		opacity:0;
		transition:left 0s 0.5s, opacity 0.5s;
	}
	#mainMenu:target {
		left:0;
		opacity:1;
		transition:opacity 0.5s;
	}
	#mainMenu ul {
		display:flex;
		flex-direction:column;
		justify-content:center;
		padding:clamp(1rem, 4vw, 2rem);
		margin:auto 0;
		position:absolute;
		right:-50%;
		min-height:100%;
		text-align:center;
		background:var(--primeColor);
		box-shadow:0 0 2rem 1rem var(--shadowColor);
		transition:left 0.5s;
	}
	#mainMenu:target ul {
		right:0;
	}
	#mainMenu ul:before {
		content:"Menu";
		display:block;
		margin-bottom:2rem;
		font-size:2rem;
		font-weight:normal;
	}
	#mainMenu li {
		margin:0;
	}
	#mainMenu li a {
		display:block;
		float:none;
	}
	#mainMenu .featured {
		order:200;
		margin-top:2rem;
	}
	#mainMenu li[hidden],
	#features {
		display:block;
	}
	#features label,
	#features article:before,
	#features aside {
		display:none;
	}
	#features article {
		max-width:40rem;
		padding:0 1.5rem;
		margin:0 auto 2rem;
		text-align:center;
		border-radius:0;
	}
	#features article:hover,
	#features input:nth-of-type(1):checked ~ div article:nth-of-type(1),
	#features input:nth-of-type(2):checked ~ div article:nth-of-type(2),
	#features input:nth-of-type(3):checked ~ div article:nth-of-type(3),
	#features input:nth-of-type(4):checked ~ div article:nth-of-type(4) {
		background:transparent;
	}
}

.relative {
	position: relative;
}

.z-index-2 {
	z-index: 2;
}

.z-index-3 {
	z-index: 3
}

.pointer-events-none {
	pointer-events: none;
}

.responsive-mobile-only {
	display: none;
}

@media (max-width:56em) {
	.responsive-mobile-only {
		display: block;
		width: 100%;
		height: auto;
	}

	.mobile-hide {
		display: none !important;
	}


	#motivationTools div article {
		box-shadow: 0 0.125em 0.375em var(--shadowColor);
		background-color: var(--pureColor);
	}

	#motivationTools div article::before {
		content: "";
		width: 0;
		height: 0;
		border-bottom: 40px solid var(--pureColor);
		border-left: 40px solid transparent;
		transform: rotate(45deg);
		position: absolute;
		bottom: -20px;
		box-shadow: 0 0.125em 0.375em var(--shadowColor);
		z-index: 1;
	}

	#motivationTools div article::after {
		content: "";
		position: absolute;
		background-color: var(--pureColor);
		width: 80px;
		height: 30px;
		bottom: 0;
		margin-left: -20px;
		z-index: 1;
	}

	#motivationTools div article:nth-of-type(1)::before,
	#motivationTools div article:nth-of-type(1)::after {
		left: 20px;
	}

	#motivationTools div article:nth-of-type(2)::before,
	#motivationTools div article:nth-of-type(2)::after {
		left:0;
		right:0;
		margin-left:auto;
		margin-right:auto;
	}

	#motivationTools div article:nth-of-type(3)::before,
	#motivationTools div article:nth-of-type(3)::after {
		right: 20px !important;
	}
}

.mt-10px {
	margin-top: 10px !important;
}

.icon_logo::before {
	content: "";
	background-image: url("../images/logos/leadplug.png");
	background-repeat: no-repeat;
	background-size: cover;
	padding: 0;
	margin-right: 0.75rem;
	width: 40px;
	height: 40px;
	display:inline-block;
	vertical-align:top;
}

.text-bold {
	font-weight: bold;
}

.italic {
	font-style: italic;
}

.text-small {
	font-size: 14px;
}

.text-flow {
	color: var(--flowColor);
	font-style: normal;
}

.hamburger-menu-bar {
	display: block;
	margin-bottom: 5px;
	border-radius: 7px;
	width: 40px;
	height: 7px;
	background-color: var(--flowColor);
}
.hamburger-menu-bar:nth-child(1) {
	transform-origin: top left;
}

.hamburger-menu-bar:nth-child(3) {
	transform-origin: bottom left;
	margin-bottom: 0;
}

.close-menu {
	position: absolute;
	right: 10px;
	top: 10px;
	padding-right: 0 !important;
}

.close-menu .hamburger-menu-bar {
	width: 37px;
}

.close-menu .hamburger-menu-bar:nth-child(1) {
	transform: rotate(45deg);
}

.close-menu .hamburger-menu-bar:nth-child(2) {
	opacity: 0;
}

.close-menu .hamburger-menu-bar:nth-child(3) {
	transform: rotate(-45deg);
	margin-bottom: 0;
}

.features-icon {
	display: flex;
}

.features-icon::before {
	content: "";
	display: inline-block;
	background-repeat: no-repeat;
	background-size: contain;
	width: 40px;
	height: 45px;
	filter: grayscale(1);
}

.battle-icon::before {
	background-image: url("../images/tools/battle.svg");
}

.leading-board-icon::before {
	background-image: url("../images/tools/leaderboard.svg");
}

.statistics-icon::before {
	background-image: url("../images/tools/statistics.svg");
}

.w-100 {
	width: 100%;
}

.text-alt {
	color: var(--altColor);
}

.mt-min-25px {
	margin-top: -25px;
}

.overflow-hidden {
	overflow: hidden;
}

.most-popular::before {
	content: attr(data-ribbon);
	position: absolute;
	font-weight: bold;
	font-size: var(--f);
	top: 0;
	right: 0;
	transform: translate(29.29%, -100%) rotate(45deg);
	color: #fff;
	text-align: center;
	border: 1px solid transparent;
	border-bottom: 0;
	transform-origin: bottom left;
	padding: 5px 35px calc(var(--d) + 5px);
	background: linear-gradient(rgba(0, 0, 0, 0.5) 0 0) bottom/100% var(--d)
	no-repeat var(--c);
	background-clip: padding-box;
	clip-path: polygon(0 0,100% 0,100% 100%,calc(100% - var(--d)) calc(100% - var(--d)),var(--d) calc(100% - var(--d)),0 100%);
	-webkit-mask: linear-gradient(135deg,transparent calc(50% - var(--d) * 0.707),#fff 0) bottom left,
	linear-gradient(-135deg, transparent calc(50% - var(--d) * 0.707), #fff 0)bottom right;
	-webkit-mask-size: 300vmax 300vmax;
	-webkit-mask-composite: destination-in, xor;
	mask-composite: intersect;
}

.left-ribbon::before {
	left: 0;
	right: auto;
	transform: translate(-29.29%, -100%) rotate(-45deg);
	transform-origin: bottom right;
}

.w-auto {
	width: auto !important;
}

.form-message {
	padding: 10px;
	border-radius: 5px;
	margin-bottom: 20px;
	display: none;
}

.form-message.success {
	color: green;
	background-color: #d4edda;
	border-color: #c3e6cb;
	display: block !important;
}

.form-message.error {
	color: red;
	background-color: #f8d7da;
	border-color: #f5c6cb;
	display: block !important;
}

.position-fixed {
	position: fixed;
}

.d-block {
	display: block !important;
}

.progress-container {
	position: fixed;
	top: 0;
	z-index: 3;
	width: 100%;
	height: 10px;
	background: #ccc;
}

.progress-bar {
	height: 10px;
	background: #04AA6D;
	width: 0;
}
