body {
    padding: 10%;
    margin: 0;

    background: white;
	background-image: radial-gradient(black 1.25px, transparent 0);
	background-size: 40px 40px;
	background-position: -17px -17px;
	
	animation: bgmove;
	animation-duration: 2s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;

}

html {scroll-behavior: smooth;}

@keyframes bgmove{
	from {
		background-position: 20px -20px;
	}
	to {
		background-position: 60px -60px;
	}
}

pre {
    font-family: "Roboto Mono";
    font-size: 14px;
    background-color: #e8e8e83e;
    width: 80%;
    border-radius: 15px;
    padding-left: 25px;
    box-shadow: 0px 0px 10px 5px #e8e8e8;
    border: solid 1px #d8d8d8;

    /* backdrop-filter: blur(1px); */
}

pre code {
    background-color: #e8e8e83e;
    margin: 0;
}

.hljs {
    background: none !important;
}

h2 {
    font-family: "Raleway";
    font-size: 32px;
    letter-spacing: 1px;
    font-weight: bold;
}

p, a {
    font-family: "Raleway";
	color: black;
	text-decoration: none;
}

@media only screen and (max-width: 600px) {
	body {
		padding: 2%;
	}
	pre {
		width: 90%;
	}

	h2 {
		font-family: "Raleway";
		font-size: 24px;
		letter-spacing: 1px;
		font-weight: bold;

		margin-inline: 2%;
	}

	pre code {
		font-size: 12px;
	}

	p {
		font-size: 14px;
		margin-inline: 2%;
	}
}