/* Main page eg. Human styles specific styles */
/*
 * Dude width and height is determined by the screen, if in Computer screen the it is set!
 * Other variables are static
*/

body {
	margin: 0;
}

#main {
	
	a, a:hover, a:visited {
		text-decoration: none;
	}
	
	
	padding-left: var(--winwid);
    padding-top: var(--winhei);


		
	.ball {
	    font-family: monospace;
		width: var(--ball_size);
		height: var(--ball_size);
		background-color: var(--ballcolor);
		border-radius: 50%;
		height: var(--ball_size);
    	position: absolute;
		margin: auto;
		border: 2px dashed gray;
		background-repeat: no-repeat; /* Ensure the background image is not repeated */
		background-position: center center; /* Center the background image both horizontally and vertically */
		background-size: 80%;
	}
	
	.autumn_ball_pic {
		background-image: url('logo_trans_gray.png');
	}
	
	.quart_text {
        position: relative;
        width: 80%;
        margin: auto;
        text-align: center;
        font-family: monospace;
        font-size: calc(0.003em * var(--ball_size));
	}
	
}