html {
	--black: #000000;
	--white: #ffffff;
	--grey-five: #f5f6f6;
	--grey-ten: #ececed;
	--grey-fifteen: #e3e4e5;
	--grey-twentyfive: #d0d1d3;
	--grey-fifty: #a1a3a6;
	--grey-seventyfive: #72757a;
	--grey: #43474e;
	--dk-grey: #121418;
	--dk-blue: #193544;
	--lt-blue: #4C91C5;
	--green: #81C16D;
	--green-blue: #1f7081;
	--lt-orange: #e8972d;
	--dk-orange: #d5883b;
	--purple: #63428e;
	--h-spacing: 1.5rem;
	--h-spacing-half: 3rem;
	--v-spacing: 1.5rem;
	--content-spacer: 1.5rem;
	--container-space: 1.5rem;
	--container-radius: 1rem;
	--sm-space: 1.5rem;
	--md-space: 3rem;
	--lg-space: 5rem;
	--base-font-size: 18px;
	--scale-font-size: 18px;
	font-size: var(--base-font-size);
}

@media screen and (min-width: 40em) {
	html {
		--container-space: 3rem;
	}
}

@media screen and (min-width: 60em) {
	html {
		--h-spacing: 3rem;
	}
}

@media screen and (min-width: 90em) {
	html {
		--h-spacing: 5vw;
		--h-spacing-half: 2.5vw;
		--base-font-size: 19px;
	}
	
	#editor {
		--h-spacing: 3rem;
		--h-spacing-half: 3rem;
	}
}

@media screen and (min-width: 110em) {
	html {
		--h-spacing: 10vw;
		--h-spacing-half: 5vw;
		--base-font-size: 20px;
	}
}

@media screen and (min-width: 130em) {
	html {
		--h-spacing: 15vw;
		--h-spacing-half: 7.5vw;
	}
}

.has-white-color, .has-white-color:visited {
	color: var(--white);
}
.has-black-color, .has-black-color:visited {
	color: var(--black);
}
.has-grey-five-color, .has-grey-five-color:visited {
	color: var(--grey-five);
}
.has-grey-ten-color, .has-grey-ten-color:visited {
	color: var(--grey-ten);
}
.has-grey-fifteen-color, .has-grey-fifteen-color:visited {
	color: var(--grey-fifteen);
}
.has-grey-twentyfive-color, .has-grey-twentyfive-color:visited {
	color: var(--grey-twentyfive);
}
.has-grey-fifty-color, .has-grey-fifty-color:visited {
	color: var(--grey-fifty);
}
.has-grey-seventyfive-color, .has-grey-seventyfive-color:visited {
	color: var(--grey-seventyfive);
}
.has-grey-color, .has-grey-color:visited {
	color: var(--grey);
}
.has-dk-grey-color, .has-dk-grey-color:visited {
	color: var(--dk-grey);
}
.has-dk-blue-color, .has-dk-blue-color:visited {
	color: var(--dk-blue);
}
.has-dk-blue-color, .has-dk-blue-color:visited {
	color: var(--dk-blue);
}
.has-lt-blue-color, .has-lt-blue-color:visited {
	color: var(--lt-blue);
}
.has-green-color, .has-green-color:visited {
	color: var(--green);
}
.has-green-blue-color, .has-green-blue-color:visited {
	color: var(--green-blue);
}
.has-lt-orange-color, .has-lt-orange-color:visited {
	color: var(--lt-orange);
}
.has-dk-orange-color, .has-dk-orange-color:visited {
	color: var(--dk-orange);
}
.has-purple-color, .has-purple-color:visited {
	color: var(--purple);
}


.has-white-background-color {
	background-color: var(--white);
}
.has-black-background-color {
	background-color: var(--black);
}
.has-grey-five-background-color {
	background-color: var(--grey-five);
}
.has-grey-ten-background-color {
	background-color: var(--grey-ten);
}
.has-grey-fifteen-background-color {
	background-color: var(--grey-fifteen);
}
.has-grey-twentyfive-background-color {
	background-color: var(--grey-twentyfive);
}
.has-grey-fifty-background-color {
	background-color: var(--grey-fifty);
}
.has-grey-seventyfive-background-color {
	background-color: var(--grey-seventyfive);
}
.has-grey-background-color {
	background-color: var(--grey);
}
.has-dk-grey-background-color {
	background-color: var(--dk-grey);
}
.has-dk-blue-background-color {
	background-color: var(--dk-blue);
}
.has-dk-blue-background-color {
	background-color: var(--dk-blue);
}
.has-lt-blue-background-color {
	background-color: var(--lt-blue);
}
.has-green-background-color {
	background-color: var(--green);
}
.has-green-blue-background-color {
	background-color: var(--green-blue);
}
.has-lt-orange-background-color {
	background-color: var(--lt-orange);
}
.has-dk-orange-background-color {
	background-color: var(--dk-orange);
}
.has-purple-background-color {
	background-color: var(--purple);
}




.has-blue-gradient-background {
	background: linear-gradient(135deg, var(--lt-blue) 0%, var(--green) 100%);
}
.has-blue-green-gradient-background {
	background: linear-gradient(135deg, var(--lt-blue) 0%, var(--green-blue) 100%);
}
.has-green-gradient-background {
	background: linear-gradient(135deg, var(--green) 0%, var(--green-blue) 100%);
}
.has-dk-neutral-gradient-background {
	background: linear-gradient(135deg, var(--dk-grey) 0%, var(--grey) 100%);
}
.has-neutral-gradient-background {
	background: linear-gradient(135deg, var(--grey) 0%, var(--grey-fifty) 100%);
}
.has-md-neutral-gradient-background {
	background: linear-gradient(135deg, var(--grey-fifty) 0%, var(--grey-fifteen) 100%);
}
.has-lt-neutral-gradient-background {
	background: linear-gradient(135deg, var(--grey-twentyfive) 0%, var(--grey-ten) 100%);
}