[class^="dexlogo-"],
		[class*=" dexlogo-"] {
			font-family: 'Dex';
			speak: never;
			font-style: normal;
			font-weight: normal;
			font-variant: normal;
			text-transform: none;
			line-height: 1;

			-webkit-font-smoothing: antialiased;
			-moz-osx-font-smoothing: grayscale;
		}
		.dexlogo-logo:before {content: "\e900";}
		.dexlogo-text:before {color:#ffffff; content: "\e901";}
		
		.dex-logo,
		.dex-logo:visited {
			align-items: center;
			color: var(--color-black);
			display: inline-flex;
			gap: 10px;
			position: relative;
			text-decoration: none;
		}
		
		.dex-logo:hover {
			text-decoration: none!important; /* important to overlap footer style */
		}
		
		.dexlogo-logo {
			position: relative;
		}
		
		.dexlogo-logo::before {
			background: linear-gradient(80deg, #00ED96 10%, #0DBBB4, #3297CC 69%, #9465B5, #8B24DC);
			font-size: 2.25rem;
			-webkit-background-clip: text;
			-webkit-text-fill-color: transparent;
		}

		.dexlogo-logo::after {
			background: linear-gradient(80deg, #00ED96 10%, #0DBBB4, #3297CC 69%, #9465B5, #8B24DC);
			color: #000000;
			content: "\e900";
			font-family: 'Dex';
			font-size: 2.25rem;
			left: 0;
			position: absolute;
			overflow: hidden;
			width: 0;
			z-index: 1;
			transition: 0.2s ease-out width;
			-webkit-background-clip: text;
			-webkit-text-fill-color: transparent;
		}

		.dex-logo:hover .dexlogo-logo::after {
			width: 100%;
		}
		
		.dexlogo-text {
			font-size: 1.5rem;
		}