/*
================================================================================
BODY
================================================================================ */
body {
	
	margin					: 8px;
	font-family				: Arial;
}		



/*
================================================================================
ANCHORS
================================================================================ */		
a:link, 
a:visited {
	text-decoration: none;
	color: blue;
}
a:hover {
	text-decoration: none;
	color: red;
}


/*
================================================================================
General settings
================================================================================ */

div {		
	border					: 0px solid magenta;
	max-width				: 100vw;
	font-size				: 5vw;
}		
		
div#image_title {		
			
	font-size				: 8vw;
	overflow				: hidden;
}		
		
div#intro p {		
			
	text-align				: left;
	padding					: 5px;
}		

div#techstuff {
	margin-top: 150px;
}


td {		
	vertical-align			: top;
}


/*
================================================================================
Responsive
================================================================================ */
/*
--------------------------------------------------------------------------------
Case 1  |  min-width <= 276px
-------------------------------------------------------------------------------- */

@media (min-width:276px) {
	
	div#intro p {
	
		text-align			: left;
		font-size			: 5vw;
		padding				: 5px;
	}
	div#intro p input {
	
		text-align			: left;
		font-size			: 22pt;
		padding				: 5px;
	}	
	div#techstuff {
		
		font-size			: 14pt;
	}		
	td.intro {
	
		text-align			: left;
		font-size			: 5vw;
		padding				: 2px;
	}	
	input.intro {
	
		text-align			: left;
		font-size			: 5vw;
		padding				: 10px;
		background-color	: #eee;
	}	
	input.submit {
		
		background-color	: black;		
		color				: white;		
		padding				: 10px;
	}	
	div#thank_you {
		
		font-size			: 6vw;
		color				: green
	}
}

/*
--------------------------------------------------------------------------------
Case 2  |  min-width <= 900px
-------------------------------------------------------------------------------- */

@media (min-width:900px) {
	
	div#image_title {
		font-size			: 28pt;
	}	
	div#intro {	
		max-width			: 810px;
	}		
	div#intro p {		
			
		text-align			: left;
		font-size			: 22pt;
		padding				: 5px;
	}		
	div#techstuff {
		
		font-size			: 12pt;
		color				: silver;
	}	
	td.intro {		
			
		text-align			: left;
		font-size			: 22pt;
		padding				: 2px;
	}			
	input.intro {		
			
		text-align			: left;
		font-size			: 22pt;
		padding				: 10px;
		background-color	: #eee;
	}	
	input.submit {
		
		background-color	: black;		
		color				: white;		
		padding				: 10px;
	}
	div#thank_you {
		
		font-size			: 28pt;
		color				: green
	}	
}

@media print {
	
		margin				: 8px;
		font-family			: Arial;
		font-size			: 14pt;
	}
}