/* DESKTOP */

/* cursor */
* {
	cursor: none;
}

.cursor {
	width: 8.25vh;
	height: 8.25vh;
	border-radius: 50%;
	background: var(--paletteOffWhite);
	mix-blend-mode: difference;
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	pointer-events: none !important;
	z-index: 150;
}

/* flying tags */
.flying_tag {
	width: 50vw;
	height: 50vw;
	border-radius: 50%;
	background: var(--paletteWhite);
	/*mix-blend-mode: difference;*/
	position: fixed;
	transform: translate(-50%, -50%);
  	pointer-events: none;
	z-index: 0;
}

/* moon phase */
.moon_phase {
	position: absolute;
    grid-column: 2 / 6;
    top: var(--marginX);
	padding: 0 calc(var(--marginY)*1.2);
	opacity: 0;
	transition: opacity var(--transitionTime);
	pointer-events: none;
	font-size: var(--mediumFont);
}

.moon_phase.footer {
	display: none;
}

.menu_button:hover ~ .moon_phase {
	opacity: 1;
}

/* sign up*/
nav.menu .sign_up {
	margin-bottom: auto;
}

input {
	width: auto;
	border: 0;
	padding: 0;
	font-family: "Diatype Expanded Medium";
	font-size: var(--miniFont);
    text-align: right;
	text-transform: uppercase;
	background: transparent;
    border: none;
}

input::placeholder {
	color: var(--textColor) !important;
}

input:hover::placeholder {
	color: var(--hoverColor) !important;
}

*:focus, input:focus{
    outline: none;
}

input#from,
input#subject {
	display: none;
}

input[name="submit"] {
	width: auto !important;
	background: transparent;
	cursor: pointer;
	color: var(--linkColor) !important;
}

input[name="submit"]:hover {
	color: var(--hoverColor) !important;
}

/* TABLET (HORIZONTAL) */
@media (max-width:1024px) {

	.cursor {
		display: none;
	}

}

/*TABLET (VERTICAL)*/
@media (max-width:820px) {

}

/* MOBILE */
@media (max-width:600px) {
    
    .flying_tag {
    	width: 90vw;
        height: 90vw;
    }
	
	.moon_phase {
		position: static;
        grid-column: 1 / 7;
        padding: 0;
        opacity: 1;
		display: none;
	}
	
	.moon_phase.footer {
		display: inline;
	}

}