/* Header font = https://fonts.google.com/specimen/Ranchers */

/* @import url('https://fonts.googleapis.com/css?family=Ranchers&display=swap');*/

/* ranchers-regular - latin */
@font-face {
  font-family: 'Ranchers';
  font-style: normal;
  font-weight: 400;
  src: url('/sos3/layout/fonts/ranchers-v8-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('/sos3/layout/fonts/ranchers-v8-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/sos3/layout/fonts/ranchers-v8-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('/sos3/layout/fonts/ranchers-v8-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('/sos3/layout/fonts/ranchers-v8-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/sos3/layout/fonts/ranchers-v8-latin-regular.svg#Ranchers') format('svg'); /* Legacy iOS */
	   font-display: fallback;
}

html {
	font-size:100%;
	margin:0px; 
	padding:0px; 
}
body {
	background: url('https://a67201120a85c5c47946-08e78bb04f1505b74dea7d8910a7af85.ssl.cf2.rackcdn.com/site_background.jpg') repeat; 
	background-attachment: fixed;
}

b {
	color: #369;
	font-weight:800;
}

.important {
	border:2px solid #228877;
	border-radius: 20px;
	padding:20px;
	background-color:white;
	overflow:hidden; 
}
/* this keeps border from bumping under floated objects */
#content {
	background-color: rgba(255,255,255,.95);
	border: 3px solid #228877;
	box-shadow: 0px 0px 0px 6px #FFF; 
	border-radius:20px;
	box-sizing:border-box;
	font-family: 'Helvetica', 'Arial', sans-serif;
	font-size: 1em;
	height:100%;
	line-height: 1.5em;
	margin:90px 50px 50px 50px;
	overflow:hidden; 
	padding: 20px;
	z-index:0;
}
/* stop floats from expanding outside of content */
h1 {
	border-bottom:2px solid #00AA88;
	color: #093;
	font-family: 'Ranchers', sans-serif;
	font-size: 2.5em;
	letter-spacing: 0.1em;
	line-height:1em;
}
	h1:before {
		content: '\00273F';
		color: #E83;
	}

h2 {
	border-bottom: 2px solid #09F;
	color: #09F;
	font-family: 'Ranchers', sans-serif;
	font-size: 2em;
	letter-spacing: 0.1em;
	line-height: 1em;
	clear:both;
}

h3 {
	border-bottom:none;
	color: #E83;
	font-family: 'Ranchers', sans-serif;
	font-size: 1.5em;
	letter-spacing: 0.1em;
	line-height: 1em;	
}

.right {
	float:right; 
	height:auto; 
	margin:0px 0px 20px 20px;
	max-width:100%; /* stop floats from expanding outside of content */	
}
	img.right {border-radius:10px;}
	table.right {padding-right:20px;}

.center {
	display:block;
	height:auto;
	margin:0px auto;
	max-width:100%;
}

	img.center {border-radius:10px;}

.screenshot {
	border: 3px solid #228877;
	border-radius:15px; 
	max-width:100%; 	
	height:auto;
	aspect-ratio: attr(width) / attr(height);
}

ul {	
	list-style:none;
	line-height: 1.5em;
	margin-left: -.5em;
	}
	ul li:before {
		content: '\00273F';
		color: #093;
		padding-right:8px;
		font-size:1.2em;
	}
	ul li {
		margin-left: 1.5em;
		text-indent: -1.5em; /* aligns 2nd line with indent from 1st line due to flower li */
	}
a:link, a:visited {
	color: #06C;
	text-decoration:none;
	border-bottom:1px solid #E83;
}

a:hover {
	color: #D49;
	text-decoration:none;
	border-bottom:1px solid #093;
}

hr {
	border-top:4px solid #E83;
	border-bottom:none;
	border-left:none;
	border-right:none;
	text-align:center;
	height:1px;
	margin-top:30px;
	z-index:1;
	clear:both;
}

	hr:after {
		content: '\00273F';
		display: inline-block;
		position: relative;
		top: -13px;
		padding: 0 20px;
		background-color: rgba(255,255,255,.95);
		color: #093;
		font-size: 1.5em;
		z-index:5;
	}

table.data { margin:15px auto;}
	table.data tr {}
	table.data tr td, table.data tr th { padding:5px; border:1px solid #00AA88;}
	table.data tr th { background-color:#00AA88; border-top:2px solid #228877; border-bottom:2px solid #228877; border-left:1px solid #228877; border-right:1px solid #228877; color: #FAFAFA}
	table.data tr:nth-child(odd) {background-color: #E8E8E8;}
	table.data tr:nth-child(even) {background-color: #FAFAFA;}

#footer { font-size:75%; color: #E83; }
	#footer a {	margin:0px 8px;  }
	#footer a:first-of-type { margin-left:0px;}

#boxsort, .boxsort { text-align:center;}
	.box_marriage {max-width:180px; height:auto; display:inline-block; margin:10px;}
	.box_marriage img {max-width:100%; height:auto;}
	.box_crops {max-width:33%; height:auto; display:inline-block; margin:10px; vertical-align:top; text-align:left;}		
		.box_crops p {text-align:center;}
	.box_pets, .box_clothes, .box_villagers {max-width:200px; height:auto; display:inline-block; margin:10px;}
	.box_fatigue {max-width:100px; height:auto; display:inline-block; margin:10px;}
	.box_cows {max-width: 270px; height:auto; display:inline-block; margin:10px;}

	.in_dev {filter:grayscale(100%);}

#index_topbox {text-align:center; width:95%; margin:0px auto;}
	#index_topbox #it_left {width:30%; text-align:left; display:inline-block;}
	#index_topbox #it_center {width:30%; display:inline-block;}
	#index_topbox #it_right {width:30%; text-align:right; display:inline-block;}

.negative, .positive, .neutral {margin-left:30px;}
	.positive b:first-child {color: #093;}
	.negative b:first-child {color: #F33;}

.shrinktext {font-size:80%;}

/* ---------- BREADCRUMBS ------------------------- */

ol#breadcrumbs {
	margin:0px; padding:0px; list-style-type:none;
}
	ol#breadcrumbs li {display:inline; color:#00AA88;}
	ol#breadcrumbs li a {border-bottom:none; padding:0px; font-size:80%;}

/* ---------- MOBILE ------------------------------ */

@media (max-width:600px){

#content {
		margin-left: 0px;
		margin-right:0px;
	}

#index_topbox {}
#it_left, #it_center {width:48% !important}
#it_right {display:none; width:0px; height:0px;}

ul {
	margin:0px;
	padding:5px 5px 5px 20px
	}

	li:before {
		font-size:1em;	
	}

hr:after {display: none;}

img.screenshot {float:none; display:block; margin:0px auto;}

.shrinktext {font-size:60%;}
.box_crops {max-width:none;}
.nomobile {display:none;}

h3 {clear:both;}

} /*--- end mobile ---*/

@media print {
	#content {
		background-color: white;
		border: none;
		box-shadow: none;
		border-radius: 0px;
		box-sizing: initial;
		font-family: 'Helvetica', 'Arial', sans-serif;
		font-size: 1em;
		height:100%;
		line-height: 1.5em;
		margin: 0px;
		overflow: display;
		padding: 0px;
		}

#sn_hamburger_background, #sn_menu_background, #sn_menu_outer, #sn_menu_toggle, #footer {
		display:none;
		visibility:hidden;
	}
}


/* ---------- NAVIGATION ------------------------------ */

/* the horizontal bar that holds hamburgers yum yum */
#sn_hamburger_background {
	position:fixed; 
	top:0px; left:0px; 
	width:100%; height:40px;
	z-index:10; 
	overflow:hidden; 
	background-color:#00AA88; 
	border-bottom: 2px solid #FFF;
	outline: 4px solid #00AA88;
	box-shadow:0 7px 5px 0px rgba(0,0,0,0.4);	
/*	cursor:url('https://a67201120a85c5c47946-08e78bb04f1505b74dea7d8910a7af85.ssl.cf2.rackcdn.com/chef.cur'), auto;*/
}

.nav_label {
	margin-left:70px;
	line-height:40px;
	color:#FFF;
	font-size:1.4em;
	font-family: 'Ranchers', sans-serif;
	letter-spacing: 0.1em;
	}

.nav_help {}

/* opened menu box */
#sn_menu_background {background:rgba(10,80,70,0.9); width:48vw; border-left:1vw solid transparent; border-right:.2vw solid #228877; height:100vh; min-width:295px; position:fixed; left:0; top:-100%; opacity:0; transition: top 0s 2s, opacity 0.5s 1s; z-index:100005; box-shadow:0 0 20px rgba(0,0,0,0.4);}

#sn_menu_outer {display:block; font:700 18px/36px 'Helvetica', sans-serif; color:#FAFAFA; width:50vw; border-left:1vw solid transparent; border-right:1vw solid transparent; height:100vh; min-width:295px; opacity:0; position:fixed; left:0; top:-100vh; transition: 0.5s 0.75s; z-index:100010; overflow:hidden; overflow-y:auto; -webkit-overflow-scrolling: touch;}

#sn_menu_vertical {width:1px; height:100vh; display:inline-block; vertical-align:middle;}

#sn_menu_outer #sn_menu p {position:relative; padding:0; margin:0;}

/* menu text color: white */
#sn_menu_outer #sn_menu p label {display:block; line-height:39px; text-transform:uppercase; margin-left:-15px; color: #FAFAFA; text-decoration:none; border-bottom:none;}
/* menu text color hover: teal */
#sn_menu_outer #sn_menu p label:hover {color:#00AA88; text-decoration:none; border-bottom:none;}

/* active menu link color: darker white */
#sn_menu_outer #sn_menu p a {line-height:39px; color:#E8E8E8; text-decoration:none; border-bottom:none;}
/* active menu link color hover: orange*/
#sn_menu_outer #sn_menu p a:hover {color:#E83; text-decoration:none; border-bottom:none;}
#sn_menu_outer #sn_menu p a.notdone:hover {color:#999; text-decoration:none; border-bottom:none;}

#sn_menu_outer #sn_menu p label:last-child {display:none; position:absolute; left:0; top:0; width:100%; height:40px; background:rgba(0,0,0,0);}
#sn_menu_outer #sn_menu p label span {display:inline-block; width:0; height:0; border:5px solid transparent; border-top-color:rgba(10,80,70); margin:0 4px 0 0;}

#sn_menu_outer #sn_menu div p {height:0; overflow:hidden; opacity:0; transition:0.75s;}
#sn_menu_ip input[id*="sn_menu"] {display:none;}
#sn_menu_outer div {padding:0; margin:0; list-style:none;}
#sn_menu_outer #sn_menu {width:90%; display:inline-block; vertical-align:middle; overflow:hidden}
#sn_menu_outer #sn_menu {width:90%; max-width:400px; margin:0 auto; overflow:hidden; overflow-y:auto;}
/* bottom border for top-level menu items */
#sn_menu_outer #sn_menu > p {text-indent:15px; border-bottom:1px solid #DBDBDB;}
#sn_menu_outer #sn_menu div p {text-indent:30px;}
#sn_menu_outer #sn_menu div div p {text-indent:45px;}
#sn_menu_outer #sn_menu div div div p {text-indent:60px;}

/* hamburger */
#sn_menu_toggle {padding:0; margin:0; position:fixed; left:0; top:0; height:38px; width:80px; text-align:center; color:#F5F5F5; z-index:100020; background:transparent; transition: 0.5s; background 0.5s 0.5s;}
#sn_menu_toggle label {display:block; width:80px; height:38px; position:absolute; left:0; top:0; /* cursor:url('https://a67201120a85c5c47946-08e78bb04f1505b74dea7d8910a7af85.ssl.cf2.rackcdn.com/chef.cur'), auto;*/ }
#sn_menu_toggle label:nth-of-type(1) span {display:block; width:30px; height:12px; position:absolute; top:10px; left:22px; border-top:4px solid #FAFAFA; border-bottom:4px solid #DBDBDB;}
#sn_menu_toggle label:nth-of-type(1) span::after {content:""; display:block; width:30px; height:4px; position:absolute; top:4px; left:0; background:#E8E8E8;}

/* close-nav X */
#sn_menu_toggle label:nth-of-type(2) {display:none;}
#sn_menu_toggle label:nth-of-type(2) span {display:block; width:50px; height:50px; position:absolute;}
#sn_menu_toggle label:nth-of-type(2) span::before {content:""; display:block; width:30px; height:4px; position:absolute; top:22px; left:24px; background:#F5F5F5; transform:rotate(45deg); transform-origin:center center;}
#sn_menu_toggle label:nth-of-type(2) span::after {content:""; display:block; width:30px; height:4px; position:absolute; top:22px; left:24px; background:#F5F5F5; transform:rotate(-45deg); transform-origin:center center;}

#sn_menu_ip input[class*="00"]:checked ~ #sn_menu_background {top:0; opacity:1; transition: opacity 0.5s, top 0s;}
#sn_menu_ip input[class*="00"]:checked ~ #sn_menu_outer {top:0; opacity:1; transition: 0.5s 0.5s;}
#sn_menu_ip input[class*="00"]:checked ~ #sn_menu_toggle {background:transparent; transition: 0.5s; left:50%; margin-left:-70px;}
#sn_menu_ip input[class*="00"]:checked ~ #sn_menu_toggle label {display:none;}
#sn_menu_ip input[class*="00"]:checked ~ #sn_menu_toggle label:last-child {display:block;}

@media only screen and (max-width: 590px) {
	#sn_menu_ip input[class*="00"]:checked ~ #sn_menu_toggle {left:230px; margin-left:0;}
}

#sn_menu_ip input[class*="01"]:checked ~ #sn_menu_outer #sn_menu .sn_menu01 + div > p,
#sn_menu_ip input[class*="02"]:checked ~ #sn_menu_outer #sn_menu .sn_menu02 + div > p,
#sn_menu_ip input[class*="03"]:checked ~ #sn_menu_outer #sn_menu .sn_menu03 + div > p,
#sn_menu_ip input[class*="04"]:checked ~ #sn_menu_outer #sn_menu .sn_menu04 + div > p,
#sn_menu_ip input[class*="05"]:checked ~ #sn_menu_outer #sn_menu .sn_menu05 + div > p,
#sn_menu_ip input[class*="06"]:checked ~ #sn_menu_outer #sn_menu .sn_menu06 + div > p,
#sn_menu_ip input[class*="07"]:checked ~ #sn_menu_outer #sn_menu .sn_menu07 + div > p,
#sn_menu_ip input[class*="08"]:checked ~ #sn_menu_outer #sn_menu .sn_menu08 + div > p,
#sn_menu_ip input[class*="09"]:checked ~ #sn_menu_outer #sn_menu .sn_menu09 + div > p,
#sn_menu_ip input[class*="10"]:checked ~ #sn_menu_outer #sn_menu .sn_menu10 + div > p,
#sn_menu_ip input[class*="11"]:checked ~ #sn_menu_outer #sn_menu .sn_menu11 + div > p,
#sn_menu_ip input[class*="12"]:checked ~ #sn_menu_outer #sn_menu .sn_menu12 + div > p {height:40px; opacity:1; border-bottom:1px solid rgba(10,80,70,0.2);}

#sn_menu_ip #sn_menu01:checked ~ #sn_menu_outer #sn_menu .sn_menu01 > label:last-child,
#sn_menu_ip #sn_menu02:checked ~ #sn_menu_outer #sn_menu .sn_menu02 > label:last-child,
#sn_menu_ip #sn_menu03:checked ~ #sn_menu_outer #sn_menu .sn_menu03 > label:last-child,
#sn_menu_ip #sn_menu04:checked ~ #sn_menu_outer #sn_menu .sn_menu04 > label:last-child,
#sn_menu_ip #sn_menu05:checked ~ #sn_menu_outer #sn_menu .sn_menu05 > label:last-child,
#sn_menu_ip #sn_menu06:checked ~ #sn_menu_outer #sn_menu .sn_menu06 > label:last-child,
#sn_menu_ip #sn_menu07:checked ~ #sn_menu_outer #sn_menu .sn_menu07 > label:last-child,
#sn_menu_ip #sn_menu08:checked ~ #sn_menu_outer #sn_menu .sn_menu08 > label:last-child,
#sn_menu_ip #sn_menu09:checked ~ #sn_menu_outer #sn_menu .sn_menu09 > label:last-child,
#sn_menu_ip #sn_menu10:checked ~ #sn_menu_outer #sn_menu .sn_menu10 > label:last-child,
#sn_menu_ip #sn_menu11:checked ~ #sn_menu_outer #sn_menu .sn_menu11 > label:last-child,
#sn_menu_ip #sn_menu12:checked ~ #sn_menu_outer #sn_menu .sn_menu12 > label:last-child {display:block;}

#sn_menu_ip input[class*="01"]:checked ~ #sn_menu_outer #sn_menu .sn_menu01 > label,
#sn_menu_ip input[class*="02"]:checked ~ #sn_menu_outer #sn_menu .sn_menu02 > label,
#sn_menu_ip input[class*="03"]:checked ~ #sn_menu_outer #sn_menu .sn_menu03 > label,
#sn_menu_ip input[class*="04"]:checked ~ #sn_menu_outer #sn_menu .sn_menu04 > label,
#sn_menu_ip input[class*="05"]:checked ~ #sn_menu_outer #sn_menu .sn_menu05 > label,
#sn_menu_ip input[class*="06"]:checked ~ #sn_menu_outer #sn_menu .sn_menu06 > label,
#sn_menu_ip input[class*="07"]:checked ~ #sn_menu_outer #sn_menu .sn_menu07 > label,
#sn_menu_ip input[class*="08"]:checked ~ #sn_menu_outer #sn_menu .sn_menu08 > label,
#sn_menu_ip input[class*="09"]:checked ~ #sn_menu_outer #sn_menu .sn_menu09 > label,
#sn_menu_ip input[class*="10"]:checked ~ #sn_menu_outer #sn_menu .sn_menu10 > label,
#sn_menu_ip input[class*="11"]:checked ~ #sn_menu_outer #sn_menu .sn_menu11 > label, 
#sn_menu_ip input[class*="12"]:checked ~ #sn_menu_outer #sn_menu .sn_menu12 > label {color:#E83;}

#sn_menu_ip input[class*="01"]:checked ~ #sn_menu_outer #sn_menu .sn_menu01 > label span,
#sn_menu_ip input[class*="02"]:checked ~ #sn_menu_outer #sn_menu .sn_menu02 > label span,
#sn_menu_ip input[class*="03"]:checked ~ #sn_menu_outer #sn_menu .sn_menu03 > label span,
#sn_menu_ip input[class*="04"]:checked ~ #sn_menu_outer #sn_menu .sn_menu04 > label span,
#sn_menu_ip input[class*="05"]:checked ~ #sn_menu_outer #sn_menu .sn_menu05 > label span,
#sn_menu_ip input[class*="06"]:checked ~ #sn_menu_outer #sn_menu .sn_menu06 > label span,
#sn_menu_ip input[class*="07"]:checked ~ #sn_menu_outer #sn_menu .sn_menu07 > label span,
#sn_menu_ip input[class*="08"]:checked ~ #sn_menu_outer #sn_menu .sn_menu08 > label span,
#sn_menu_ip input[class*="09"]:checked ~ #sn_menu_outer #sn_menu .sn_menu09 > label span,
#sn_menu_ip input[class*="10"]:checked ~ #sn_menu_outer #sn_menu .sn_menu10 > label span,
#sn_menu_ip input[class*="11"]:checked ~ #sn_menu_outer #sn_menu .sn_menu11 > label span, 
#sn_menu_ip input[class*="12"]:checked ~ #sn_menu_outer #sn_menu .sn_menu12 > label span {border-top-color:#00AA88;}