@font-face {
    font-family: "nerd";
    src: url('/assets/fonts/SymbolsNerdFont/nerd.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "Atkynson";
    src: url('/assets/fonts/AtkynsonMonoNerdFont/AtkynsonMonoNerdFont-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "Atkynson";
    src: url('/assets/fonts/AtkynsonMonoNerdFont/AtkynsonMonoNerdFont-Bold.woff2') format('woff2');
    font-weight: bold;
    font-style: bold;
}

:root {
	font-family: "Atkynson", "nerd";
	line-height: 1.4;
	font-weight: 400;
	height: fit-content;
}

body {
	font-family: "Atkynson", "nerd";
	margin: 0 auto;
	width: 90%;
}

.dashboard {
	  display: flex;
	  flex-direction: row;

	/* Adaptped from the original in Uiverse.io by SteveBloX */ 
	a {
		text-align: center;
		text-decoration: none;
		transition: all 0.3s;
		cursor: pointer;
		border-radius: 0.5rem;
		padding: 0.5rem;
		width: 20rem;
		margin: 0.5rem;

		.dashboard-button {
			display: grid;
			grid-template-columns: 2rem auto;
			column-gap: 0px;
			align-items: center;
			.dashboard-button-icon {
				font-size: 1.25rem;
				text-align: justify;
			}
			.dashboard-button-title {
				text-align: justify;
				font-size: 1rem;
				font-weight: bold;
			}
		}
	}

	a:hover {
	  color: white;
	}

	#pmrt {
	  border: 3px solid #94C11F;
	  background: white;
	  color: #94C11F;
	}

	#pmrt:hover {
	  background: #94C11F;
	  color: white;
  }

	#iots {
	  border: 3px solid #352171;
	  background: white;
	  color: #352171;
	}

	#iots:hover {
	  background: #352171;
	  color: white;
  }

	#phonia {
	  border: 3px solid #31C9C2;
	  background: white;
	  color: #31C9C2;
	}

  #phonia:hover {
	  background: #31C9C2;
	  color: white;
  }

}