<style type="text/css">
/* Copyright: Ron Mazier */
	 
/**** Body ****/
	html {
		display: inline-block;
		}
	body {
		margin: 0px;
		margin: 0px;
		padding: 0px;
		}
	form {
		margin: 0px;
		border: 0px;
		padding: 0px;
		}
	#all {
		box-sizing:		border-box;
		font-family:	Arial, Tahoma, Verdana;
		width:			100%;
		margin-left:	auto;
		margin-right: 	auto;
		margin-top: 	0px;
		margin-bottom: 	0px;
		padding: 		0px;
	}
		 
/**** Header ****/ 
	#header	{
		box-sizing:			border-box;
		display:			inline-block;
		width: 				100%;
		height: 			250px;
		margin: 			0px;
		background-color: 	rgba(240,240,240,0.3);
		background-image: 	url(https://www.nolareferral.com/background_nr.jpg); 
		background-size: 	100% 100%;
		background-position: center;
		background-repeat: no-repeat;
		padding: 			30px;
		border: 			0px;
		border-bottom:		2px solid #808080;
		text-align: 		right;
		color: 				white;
		vertical-align: 	center;
		font-size: 			120%;
		font-weight:		bold;

		}
	#header div {
		box-sizing:			border-box;
		display:			inline-block;
		width: 				80%;
		float:				left;
		text-align: 		left;

	}
 	#header div div {
		box-sizing:			border-box;
		display:			inline-block;
		width: 				200px;
		min-width:			200px;
		height:				100%;
		height:				100px;
		padding:			0px;
		float:				left;
		text-align: 		left;
	}
	#header img 	{
		border: 	none;
		max-width:	200px;
		max-height: 200px;
		float: 		none;
		margin-right: auto;
		margin-left: auto;
		vertical-align: bottom;
	} 

	@media screen and (min-width:901px) {
		#header	{
			height: 		300px;
		}
	}
	@media screen and (max-width:900px) and (min-width:540px) {
		#header	{
			height: 		250px;
		}
	}
	@media screen and (max-width:539px)	{
		#header	{
			height: 		200px;
		}
	}

/**** Wrap ****/

	#wrap		{
			box-sizing:		border-box;
			width: 			100%;
			margin: 		0px;
			padding:		0px;
			border: 		0px;
			display:		block;
			color: 			#333333;
		}
	#content	{
			box-sizing:		border-box;
			width: 			100%;
			margin: 		0px;
			padding:		0px; 
			border: 		0px;
			display:		block;
			margin-left: 	auto;
			margin-right: 	auto;
		}
	#homepage	{
			box-sizing:		border-box;
			width: 			100%;
			background: 	transparent;
			float: 			none;
			clear: 			both;
			display:		inline-block;
			padding: 		10px;
			margin-left: 	auto;
			margin-right: 	auto;
			text-align: center;
		}
/*
	#homepage ul	{
			list-style-type: decimal;
			margin: 0px 0px 0px 5px;
			padding: 0px;
		}
	#homepage ul li 	{
			padding: 0px 0px 0px 5px;
			margin: 0px 0px 5px 0px;
		}
	#homepage ol	{
			list-style-type: upper-roman;
			margin: 0px 0px 0px 5px;
			padding: 0px;
		}
	#homepage ol li 	{
			padding: 0px 0px 0px 5px;
			margin: 0px 0px 3px 0px;
		}		
*/

/**** 2-columns	****************/
	#InstructionBox {
		text-align: 	left;
	} 
  
	#twocolumns {
		box-sizing:		border-box;
		display:		inline-block;
		margin-left: 	auto;
		margin-right: 	auto;
		width:			100%;
		padding:		0px;
		text-align: 	center;
	} 
	#twocolumns div {
		box-sizing:		border-box;
		min-width: 		200px;
		width: 			50%;
		margin: 		0px;
		padding: 		30px;
		border: 		0px;
		float: 			left;
		text-align: 	left;
		vertical-align: text-top;
		} 
	#twocolumns ul {

		list-style-image: url('Logo_li.png');
		} 
	@media screen and (max-width:539px)	{
		#twocolumns div {
		width: 			100%;
		padding: 		10px;
		margin-left: 	auto;
		margin-right: 	auto;
		} 
	}
	@media screen and (max-width:900px) and (min-width:540px) {
		#twocolumns div {
		padding: 		20px;
		} 
	}

/**** BUTTONS and HTML ELEMENTS ****/

li{
list-style-type: none;
margin:10px;
}
	a:hover {
		text-decoration: underline;
	}
	input {
		border-radius: 5px;
		background-color: #f8f8ff;
		padding:		3px;
	}
	input[type="button"],	input[type="submit"] {
		box-sizing:	border-box;
		display:	in-line;
		width:   		96px;
		height:  		32px;
		margin: 	 	2px;
		margin-left: 	auto;
		margin-right: 	auto; 
		word-wrap: 		normal;
		white-space: 	normal;
		border:			1px;
		border-radius:	3px;
		float:			left;
		transition: 	width 2s;
		transition-timing-function: linear;
		text-align: 	center;
		padding: 		5px;
		box-shadow: 	1px 1px 2px rgba(0,0,0,0.6);
	}
	input[type="button"]:hover,	input[type="submit"]:hover {
		text-decoration: underline;
		box-shadow: 	2px 2px 2px rgba(0,0,0,0.6);
		transform: 		translateY(-1px);
		}
	tr:nth-child(even) {background-color: rgba(176,230,182,0.5)}
	th {
/*		text-transform: uppercase; */
/*		background-color: #cccccc; */
		background-color: rgb(176,230,182);
		text-align: center;
		font-weight:	bold;
		border-bottom: 1px solid #aaaaaa;
		padding:	3px;
	}
	.button:active {
			box-shadow: 	1px 1px rgba(0,0,0,0.6);
			transform: 		translateY(2px);
	}
	.gobutton	{
		width: 			32px;
		height: 		32px;
		border:			1px;
		border-radius: 	16px;
		float:			right;
		margin:			5px;
	}

/****	Footer Background	* url(images/dark/footer.png) ****/
	
	#footer {
		background: rgba(100,100,100,0.2);
		background: linear-gradient(to bottom, white, rgba(100,100,200,0.2));
		box-sizing:	border-box;
		width:		100%;
		margin:		0px;
		padding: 	25px;
		clear:		both;
		border-top: 1px inset;
		display:	inline-block;
		font-size:	88%;
		font-style:	italic;
		text-align:	center;
	}
	#footer  a:hover {
			color: rgba(197,150,51,1);
		}

/* Copyright: Ron Mazier */
</style>