@media screen {

	html {margin:0px; padding:0px; font-size:11pt; color:black;}
	body {background: #E2EECC url('https://fogu.b-cdn.net/HM-ANB/site_background.png') top left repeat; margin:0px; padding:0px;}

	#wrapper {width:95%; 
		margin:60px auto 30px auto; 
		background:#E2EECC; 
		border:4px solid #663333;
		/* -moz-border-radius: 20px; */
		/* -webkit-border-radius: 20px; */
		border-radius: 20px;
		/* behavior: url(/hm10/includes/pie/PIE.htc); */
		/* padding:30px; padding-top:10px;*/
		z-index:1;
	}

	#content {padding:30px; padding-top:10px;  margin-top:125px;}

	#footer {margin:0px 30px; padding:0px; border-top:2px solid #99CC33; clear:both;}
		p#foot_links {font-size:80%; display:inline-block;}
		p#foot_links a:link, #footer p#foot_links a:visited {text-decoration:none; border-bottom:none;}	

	p, ol li, ul li, a, table td, table th {font-family:helvetica,arial,sans-serif; line-height:1.5em;}
	.right {float:right; margin:20px 0px 20px 20px;}
	.left {float:left; margin:20px 20px 20px 0px;}

	.yes-mobile {display:none;}
	
	img {
		max-width:100%; 	
		height:auto;
		aspect-ratio: attr(width) / attr(height);
	}

	a:link, a:visited {padding:0px 4px; color:#524741; text-decoration:none; border-bottom:1px solid #669933;}
	a:hover {border:2px solid #FF9933; padding:0px 2px; background-color:#FFCE77; text-decoration:none; color:#333322;}

	a.imglink, a.imglink img {text-decoration:none; border:none; padding:0px; background-color:transparent;}

	h1 {font-size:250%; font-family: helvetica, ariel, sans-serif; color:#996633;
		border-bottom:2px solid #99CC33; background: transparent url('https://fogu.b-cdn.net/HM-ANB/layout-h1-bkg.png') no-repeat bottom right;
		height:76px; line-height:3em; }
	h2 {font-size:200%; font-family: helvetica, ariel, sans-serif; color:#339999;}
	h3 {font-size:150%;font-family: helvetica, ariel, sans-serif; color:#6666CC;}

	table.data, table.schedule, table.cropdata { margin:20px auto;  background:#FAFAFA; }
	table.data td { padding:10px 5px; border:2px solid #339999; }
		table.data td.red {border:2px solid #CC3300; }
	table.data tr.color, table.cropdata tr.color { background:#F2F191; }
	table.data th, table.schedule th, table.cropdata th { background:#524741; padding:5px; color: #FAFAFA; }

	table.schedule td, table.cropdata td {padding:5px; border:1px solid #339999; font-size:80%; text-align:center;}

	table.cropdata {display:inline-block; margin:20px;}

	table.cropdata td.norm {font-size:100%;}

	table.invisible {border:none;}
	table.invisible td {padding:10px 10px; border:none;}

	table.blueprints {margin:20px auto; background-color:transparent;}
		table.blueprints td { border-bottom:2px solid #339999; }
		table.blueprints tr td:first-child { padding:20px; padding-left:0px;}

	#topbox {z-index:10; border:4px solid #663333;
		-moz-border-radius: 20px;
		-webkit-border-radius: 20px;
		border-radius: 20px;
		background: url('https://fogu.b-cdn.net/HM-ANB/layout-ad-bkg.png') repeat #E2EECC; 
		width:748px; height:100px;
		padding: 10px 0px 0px 10px;
		position: absolute;
		top:10px; left:50%; 
		margin-left:-384px;}

	#bottombox { text-align:center; height:auto; margin:0px 30px;}

	.important {
		background-color:#FFF8F4;
		border:6px solid #B17F4C;
		/* -moz-border-radius: 20px; */
		/* -webkit-border-radius: 20px; */
		border-radius: 20px;
		/*behavior: url(/hm10/includes/pie/PIE.htc); */
		padding:20px;
	}

	.smalltext {
		font-size:75%;
	}

	#content ul li {
		list-style: disc url('https://fogu.b-cdn.net/HM-ANB/layout-list-dot.png') outside;
		margin:0px 15px 10px 15px;
	}
		#content ul li ul li {margin-bottom:0px;}
	
	.farmbox { margin: 20px; width:300px; display:inline-block; vertical-align:top;	}
		.farmbox p {text-align:center;}
	
	.schedulebox, .animalbox {margin:20px; font-size:90%; text-align:left; width:350px; display:inline-block; vertical-align:top;}
	.animalbox {width:250px;}
		.schedulebox p:first-of-type, .animalbox p {font-weight:bold; margin-top:0px;}
		.schedulebox ul, .animalbox ul {padding-left:10px;}

	.hairbox { margin:20px; width:150px; display:inline-block; vertical-align:top; }	
		.hairbox p:first-of-type {text-align:center; font-weight:bold;}

	.clothbox { margin:20px; width: 425px; display:inline-block; vertical-align:top; text-align:left;}
		.clothbox p:first-of-type {font-weight:bold; margin-top:0px;}
		.clothbox p:last-of-type {margin-bottom:0px;}
		.clothbox img {float:left; margin-right:20px;}

	#planwrapper {display:table; margin:0px auto; width:80%;}
		.planbox {display:table-row;}
		.pb1 {display:table-cell; border-bottom:2px solid #339999; width:300px; vertical-align:top; padding:20px 0px;}
		.pb2 {display:table-cell; border-bottom:2px solid #339999; vertical-align:top; padding:20px 0px 20px 20px;}
		.pb2 p {margin:0px;}

	#link_index {float:left; margin-top:30px; font-size:80%; padding-left:30px;}
	#link_help {float:right; margin-top:30px; font-size:80%; padding-right:30px;}

	/* http://www.cssjockey.com/web-development/tips-tricks/an-easy-way-to-create-light-box-with-jquery-css */
	/* Lightbox background */  
   #lightbox {  
		display:none;  
		background:#524741;  
		opacity:0.75;  
		position:fixed;  
		top:0px;  
		left:0px;  
		min-width:100%;  
		min-height:100%;  
		z-index:1000;  
   }  

   /* Lightbox panel with some content */  
   #lightbox-panel {  
		display:none;  
		position:fixed;  
		top:100px;  
		left:50%;  
		margin-left:-25%;  
		width:50%;  
		height:50%;
		background:#E2EDC2;  
		padding:10px 15px 10px 15px;  
		border:4px solid #663333;  
		-moz-border-radius: 20px;
		-webkit-border-radius: 20px;
		border-radius: 20px;
		z-index:1001;  
	}  

	#support_box { border: none; }

	/* ================================================================ 
	This copyright notice must be kept untouched in the stylesheet at 
	all times.

	The original version of this stylesheet and the associated (x)html
	is available at http://www.cssplay.co.uk/menus/multi-column.html
	Copyright (c) 2005-2009 Stu Nicholls. All rights reserved.
	This stylesheet and the associated (x)html may be modified in any 
	way to fit your requirements.

	Granted reproduction use 09/19/2009 - SL

	=================================================================== */

	#nav {width:100%; background: url('https://fogu.b-cdn.net/HM-ANB/layout-nav-bkg-left.png') no-repeat top left;
		font-family:helvetica,arial,sans-serif; text-align:center; 
		position:absolute; top: 150px; z-index:20; 
		}

	#navspacer { display:table; margin:0px auto; }
	#menu {height:41px; position:relative; font-size:14px; z-index:1000; margin: 0px; padding:0px; border-collapse:collapse; background: url('https://fogu.b-cdn.net/HM-ANB/layout-nav-bkg-right.png') top right no-repeat; }

	#menu table.ie6 {border-collapse:collapse; margin:0; padding:0;}

	#menu ul {padding:0; margin:0; list-style: none; position:relative; margin-left:auto; margin-right:auto;}
	#menu ul li {float:left;}
	#menu ul li a {display:block; float:left;padding:0 15px 0 0; text-decoration:none !important; color:#524741; font-weight:bold; height:41px;line-height:40px;font-size:14px; background:url('https://fogu.b-cdn.net/HM-ANB/layout-nav-mid.png') no-repeat right top; border:none;}
	#menu ul li a b {display:block; float:left;padding:0 0 0 15px; text-decoration:none !important; color:#524741; font-weight:bold; height:41px;line-height:40px;font-size:14px;background:url('https://fogu.b-cdn.net/HM-ANB/layout-nav-mid.png') no-repeat left top; cursor:pointer; }

	#menu ul li div.holder {position:absolute; left:-9999px;}

	#menu ul li div .leftSide {float:left;background: #ddd url('https://fogu.b-cdn.net/HM-ANB/layout-nav-left.png') no-repeat left bottom;}
	#menu ul li div .rightSide {float:left; margin-left:10px; display:inline; padding:0 10px 0 0; background: #aaa url('https://fogu.b-cdn.net/HM-ANB/layout-nav-drop.png') no-repeat right bottom;}

	#menu ul li:hover {position:relative;}
	#menu ul li a:hover {color:#910; background-position:right center; white-space:nowrap; position:relative;}
	#menu ul li a:hover b {color:#910; background-position:left center;}
	#menu ul li a.sub:hover {color:#910; background-position:right bottom; white-space:nowrap; position:relative;}
	#menu ul li a.sub:hover b {color:#910; background-position:left bottom;}

	#menu ul li:hover > a {color:#910; position:relative;}
	#menu ul li:hover a.sub {color:#910; background-position:right bottom; white-space:nowrap; position:relative;}
	#menu ul li:hover a.sub > b {color:#910; background-position:left bottom;}

	#menu ul :hover div.holder {position:absolute; top:41px; left:4px; margin: 0; padding: 0;}

	#menu ul li.navright a:hover div.holder {left:auto; right:3px; top:41px;}
	#menu ul li.navright:hover div.holder {left:auto; right:4px; top:41px;}

	#menu ul dl {width:auto; margin:5px 0 10px 0; padding:0 5px;list-style:none;}
	#menu ul dl dt {padding:0 10px; margin:0; line-height:24px; background:#524741; color:#fff; white-space:nowrap;}
	#menu ul dl dd {display:block; padding:0; margin:0;}
	#menu ul dd a {background-image: none; display:block; height: 24px; line-height: 24px; color:#421; text-align:left; margin: 0; padding:0 10px;font-weight:normal; white-space:nowrap; float:none;}
	#menu ul dd a:hover {color:#c60; background: #E2EECC;}

	#menu ul table td {vertical-align:top;}

	#menu a.notdone:link, #menu a.notdone:visited, #menu a.notdone:hover {background-color:#C0E25A; color:#999999 ;}

	#nav-mobile {display:none;}
}

@media print {
	body {background: white;}
	#nav, #topbox, #bottombox, #menu, #link_index, #link_help, #lightbox, #lightbox-panel, #nav-mobile {display:none; visibility:hidden;}

	table.data, table.schedule { margin:20px auto;  background:white; }
	table.data td { padding:10px 5px; border:1px solid #996633; line-height:2em; }
	table.data tr.color { background:white; }
	table.data th, table.schedule th { background:white; padding:5px; color: black; }

	table.schedule td {padding:5px; border:1px solid #996633; font-size:80%; text-align:center;}

	.important {border:4px double #99CC33; padding:20px;}

	h1 {font-size:250%; font-family: serif; color:#996633; border-bottom:2px solid #99CC33;}
	h2 {font-size:200%; font-family: serif; color:#996633;}
	h3 {font-size:150%;font-family: helvetica, ariel, sans-serif; color:#996633}

	#content p, #content ul li {line-height:2em;}

	.right {float:right; margin:20px 0px 20px 20px;}
	.left {float:left; margin:20px 20px 20px 0px;}

}

/* 2023-04-23: moved contents of style_mobile.css to this file */
@media (max-width:600px){

	#navspacer, #menu, .no-mobile, #topbox {display:none;}

	.right, .left {float:none !important; margin:0px auto; display:block;}

	h1 {font-size:200%; font-family: helvetica, ariel, sans-serif; color:#996633; line-height:1.3em; padding-bottom:10px; border-bottom:2px solid #99CC33; background: none; clear:both; }

	#nav-mobile {text-align:center; font-weight:bold; background: white; border:2px solid #99CC33; display:block; margin-top:50px;}
	#content {padding:10px; padding-top:10px; margin-top:0px;}

	#wrapper {border:0px solid #663333; width:auto; margin:0%; behavior:none;}

	.yes-mobile {display:block;}
	.mobile-title {font-size:200%; font-weight:bold; text-align:center; color:#996633;}
	.important {background-color:#FFF8F4;
			border:6px solid #B17F4C;
			behavior: none;
			padding:20px;}

	.farmbox { margin: 10px; width:300px; display:inline-block; vertical-align:top; }

	.clothbox { width:98%; margin:0px auto 10px auto; text-align:center;}
		.clothbox p:first-of-type {font-weight:bold;}
		.clothbox img { float:none; margin-right:0px;}
		
	.p_clothing01, .p_clothing02 {
		display:block;
		float:none;
		width:150px;
		height:170px; 
		margin:0px auto;
	}

	#planwrapper {display:block; width:auto;}
		.planbox {display:block;}
		.pb1 {display:block; border-bottom:none; width:auto; vertical-align:top; padding:20px 0px 20px 0px; text-align:center;}
		.pb2 {display:block; border-bottom:2px solid #339999; vertical-align:top; padding:0px 0px 20px 0px;}
			

	#content ul { margin-left:10px; padding-left:10px;}
	#content ul li {
			list-style: disc url('https://fogu.b-cdn.net/HM-ANB/layout-list-dot.png') outside;
			margin:0px 15px 0px 15px; text-align:left;
		}

	 #lightbox-panel {  
			display:none;  
			position:fixed;  
			top:10%;  
			left:25px;  
			margin-left:0%;  
			width:80%;  
			height:80%;
			background:#E2EDC2;  
			padding:10px;  
			border:4px solid #663333;  
			z-index:1001;  
		}  
}