@import url(https://fonts.bunny.net/css?family=roboto:400,400i,900,900i);

/* html 5 for older IE: */
header, nav, section, article, aside, footer {
	display: block;
	margin: 0;
	padding: 0;
}

html, div { margin: 0; padding: 0; }

body {
	margin: 0;
	padding: 0;
	background: #FFF;
	color: #000;
	font: 20px/1.6 'Roboto', sans-serif;
	}
h1, h2, h3, h4, h5, h6, strong { font-weight: 900; }
.hide { 
	display: none;
	font-size: .85em;
}

a img { border: 0; }
img { max-width: 100%; height: auto; }

a { color: #039; }
a:visited { color: #666; }
a:hover { color: #f00; }

#wrapper {
	padding: 0;
	background: #fff;
	overflow: hidden;
}
header {
	margin: 0 auto; 
	max-width: 1100px;
	padding: 1.4em;
	overflow: hidden;
	text-align: right;
	display: flex;
	justify-content: space-between;
	gap: 1em;
	align-items: center;
}
header > img.logo {
	max-width: 40%;
}
header .logo.inner {
	display: block;
}
header .home-link {
	max-width: 25%;
}
header h1, #menu { display: none; }
header h2 {
	color: #000;
	margin: 0; 
	padding: 0;
	font-size: 1.2em;
	line-height: 1.2em;
	font-weight: 700;
	}
header h2 em {
	font-style: normal;
	color: #777;
}
header a { white-space: nowrap; }

nav#main-nav {
	padding: 0;
	background: #A9EA28;
}
#main-nav > div {
	margin: 0 auto; 
	max-width: 1100px;
}
#main-nav a {
	text-decoration: none;
	display: inline-block;
	padding: .5em 1em;
	color: #222;
	font-size: 1.05em;
	font-weight: 700;
	margin: 0;
	white-space: nowrap;
	text-shadow: 0 1px 0 #fff;
}
#main-nav a:hover {
	background: rgba(255,255,255,.5);
	color: #000;
}
#main-nav a:first-of-type {
	margin-left: -1rem;
}

#content {
	padding: 1.7em 3% 2.5em;
	overflow: hidden;
	margin: 0 auto; 
	max-width: 1100px;
	display: flex;
	justify-content: space-between;
	gap: 2em;
	align-items: flex-start;
}
#page { 
	flex-basis: 75%;
}
.single-col #page {
	flex-basis: 100%;
}
#sidebar { 
	flex-basis: 23%;
	box-sizing: border-box;
	padding: 1em 1em 20% 1em;
	border-radius: 6px;
    background-image: linear-gradient(to bottom, #ebebeb 60%, transparent);
}
#sidebar h3 {
	font-size: 1em;
	margin: 0 0 .25em 0;
}
#sidebar ul, #sidebar li {
	padding: 0;
	list-style: none;
}
#sidebar ul {
	margin: 0 0 1em .5em; 
}
footer {
	clear: both;
	padding: 1em 0;
	text-align: center;
	font-size: .9em;
	background: #f0f0f0;
	}
#footer-nav a {
	padding: 0 .7em;
	text-decoration: none;
	white-space: nowrap;
	color: #444;
}
#footer-nav a:hover {
	color: #f00;
}
h1 {
	margin: .25em 0 .5em 0;
	color: #000;
	font-size: 1.5em; 
	line-height: 1.3;
}
	
h2 { 
	color: #f00;
	margin: 1em 0 .4em 0;
	font-size: 1.3em; 
	}

h3 { 
	color: #000; 
	margin: 1em 0 .3em 0;
	font-size: 1.2em;
	}

h4 {
	color: #000;
	margin: 1em 0 .2em 0;
	font-size: 1em; 
	}
		
p, ul {
	margin-top: 0;
	margin-bottom: 1.3em;
}
.small { font-size: .85em; line-height: 1.3; }
.intro { font-size: 1.3em; line-height: 1.4; color: #444; }

ul.hilite li {
	font-weight: 700;
	margin-bottom: .2em;
	font-size: 1.2em; 
	}

ul.hilite li em { 
	color: #f00; 
	font-style: normal;
	}
.nbm { margin-bottom: 2px; }
.top { 
	clear: both;
	margin-top: 1em; 
	text-align: right; 
	font-size: .8em; 
	letter-spacing: 1px;
	text-transform: uppercase; 
	}
.cen, .cennav { text-align: center; }
.flr { float: right; margin: 0 0 5px 10px; }
.sep li { 
	margin-bottom: 1em;
	}
.new { 
	color: #f00; 
	font-size: 90%; 
	font-weight: 700; 
	}
.testimonial {
	font-size: .9em; 
	line-height: 1.5;
	font-style: italic;
	color: #444;
}
.testimonial .commenter {
	display: block;
	font-style: normal;
	color: #000;
	font-size: .85em;
	line-height: 1.3;
	margin: .5em 0;
	}
table.pricing1, table.pricing2 { margin-bottom: 1em; }
table.pricing1 td {
	background-color: #e6e6e6;
	padding: 2px 4px;
	}
table.pricing1 th {
	font-weight: 700;
	color: #000;
	background-color: #A9EA28;
	text-align: left;
	padding: 2px 6px;
	}
table.pricing1 tr.wh td, table.pricing2 tr.wh td { 
	background-color: #fff; 
	}
table.pricing2 td {
	background-color: #e6e6e6;
	padding: 2px 4px;
	}
table.pricing2 th {
	font-weight: 700;
	color: #fff;
	background-color: #60B;
	text-align: left;
	padding: 2px 6px;
	}
label { 
	display: inline-block;
	vertical-align: top;
	width: 48%; 
	text-align: right;
	margin-right: 1%;
	clear: both;
	margin-bottom: 1em;
}
.fld {
	display: inline-block;
	vertical-align: bottom;
	width: 49%;
	text-align: left;
	margin-bottom: 1em;
}
.fld ol {
	margin: 0 0 0 20px;
	padding: 0;
}
.fld ol li {
	margin: 0 0 2px 0;
}
input, select, textarea { 
	font: 100%/1.25 'Open Sans', Arial, sans-serif; 
}
option, option.styled { 
	font-size: 18px;
	font-family: 'Open Sans', Arial, sans-serif; 
}
input[type="text"], select, textarea {
	padding: 6px;
	width: 100%;
	box-sizing: border-box;
	background-color: rgba(169,234,40,0.2);
	border: 1px solid #60c;
}


input[type="submit"] {
	font-size: 105%;
	line-height: 1.25;
	padding: .15em .7em .35em;
	border-radius: 4px;
	border: 2px solid #fff;
	box-shadow: 0 0 0 1px #f00;
	text-shadow: 0 -1px 0 #000;
	color: #fff;
	font-weight: 700;
	font-size: 1.1em;
	background: rgb(174,188,191); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(174,188,191,1) 0%, rgba(110,119,116,1) 50%, rgba(10,14,10,1) 51%, rgba(10,8,9,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(174,188,191,1)), color-stop(50%,rgba(110,119,116,1)), color-stop(51%,rgba(10,14,10,1)), color-stop(100%,rgba(10,8,9,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(174,188,191,1) 0%,rgba(110,119,116,1) 50%,rgba(10,14,10,1) 51%,rgba(10,8,9,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(174,188,191,1) 0%,rgba(110,119,116,1) 50%,rgba(10,14,10,1) 51%,rgba(10,8,9,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(174,188,191,1) 0%,rgba(110,119,116,1) 50%,rgba(10,14,10,1) 51%,rgba(10,8,9,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(174,188,191,1) 0%,rgba(110,119,116,1) 50%,rgba(10,14,10,1) 51%,rgba(10,8,9,1) 100%); /* W3C */
}
input[type="submit"]:hover {
	box-shadow: 0 0 0 1px #A9EA28;
	border-color: yellow;
}	

.req { color: #60c; }
.req:before {
	content: "*";
}

a.black-btn {
	text-decoration: none;
	display: inline-block;
	padding: .15em .7em .35em;
	border-radius: 4px;
	border: 2px solid #fff;
	box-shadow: 0 0 0 1px #f00;
	text-shadow: 0 -1px 0 #000;
	color: #fff;
	font-weight: 700;
	font-size: 1.1em;
	background: rgb(174,188,191); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(174,188,191,1) 0%, rgba(110,119,116,1) 50%, rgba(10,14,10,1) 51%, rgba(10,8,9,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(174,188,191,1)), color-stop(50%,rgba(110,119,116,1)), color-stop(51%,rgba(10,14,10,1)), color-stop(100%,rgba(10,8,9,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(174,188,191,1) 0%,rgba(110,119,116,1) 50%,rgba(10,14,10,1) 51%,rgba(10,8,9,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(174,188,191,1) 0%,rgba(110,119,116,1) 50%,rgba(10,14,10,1) 51%,rgba(10,8,9,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(174,188,191,1) 0%,rgba(110,119,116,1) 50%,rgba(10,14,10,1) 51%,rgba(10,8,9,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(174,188,191,1) 0%,rgba(110,119,116,1) 50%,rgba(10,14,10,1) 51%,rgba(10,8,9,1) 100%); /* W3C */

}
a.black-btn:hover {
	box-shadow: 0 0 0 1px #A9EA28;
	border-color: yellow;
}	
	
@media ( max-width: 840px ) {
	body {
		font-size: 16px;
	}
	header h2 { font-size: 1em; margin-top: 0; }
	header > img.logo {
		max-width: 33%;
	}
	nav#main-nav {
		padding: 0 1.5em;
	}
	#page { 
		float: none; 
		width: auto;
	}
	#sidebar { 
		margin: 0;
		padding: .7em 1.2em;
	}
}

@media ( max-width: 800px ) {
	#main-nav a {
		padding: .4em .6em; 
	}
}

@media ( max-width: 700px ) {
	body { margin: 0; }
	header { padding: 1em; }
	header .home-link, 
	header .logo { max-width: 50%; }
	header .logo.inner {
		max-width: 100%;
	}
	header h2 { display: none; }
	nav#main-nav { text-align: center; }
	#main-nav a { font-size: 1em; }
	#main-nav a:hover { background: transparent; color: #f00; }
	#content { padding: 1em 1.5em; }
}

@media ( max-width: 600px ) {
	body { font-size: 110%; line-height: 1.7; }
	header { 
		position: relative;
		overflow: visible;
		text-align: center;
		margin-bottom: 2.5em;
		display: flex;
		justify-content: space-between;
		align-items: center;
		gap: 1em;
	}
	header .logo {
		max-width: 40%;
		float: none;
		margin: 0;
	}
	header > img.logo {
		max-width: 50%;
	}
	header .home-link {
		max-width: 33%;
	}
	header h2 { 
		display: block;
		width: 100%;
		position: absolute; 
		top: 100%;
		left: 0;
		background: #A9EA28; 
		vertical-align: middle;	
		font-size: 1.1em;
		padding: .5em 0;
	}
	nav#main-nav { display: none; }
    #menu { 
        display: inline-block !important; 
        text-transform: none; 
        font-weight: 700;
	}
    #menu a { 
        text-decoration: none;
		color: #000;
		font-size: 16px; 
        text-shadow: 0 1px 0 #fff; 
    }
    #lines { 
        display: inline-block;
        margin-left: 4px;
        vertical-align: -20%;
        border-bottom: 13px double #000; 
        border-top: 4px solid #000; 
        content: "";
        height: 5px; 
        width: 27px;
    }
	#menu a:hover, #menu a:active {
		color: #60b;
	}
	#menu a:hover > #lines,
	#menu a:active > #lines {
		border-color: #60b;
	}
	.intro { font-size: 1.2em; }
	label, .fld { 
		display: block;
		width: 100%;
		margin-right: 0; 
		text-align: left;
	}
	label { margin-bottom: .2em; }
	input, textarea, select { font-size: 1em; max-width: 100%; }
	input[type="text"], select, textarea {
		padding: 6px;
		width: 100%;
		box-sizing: border-box;
	}
	#content {
		display: block;
	}
	#page li { margin: .5em 0; }
	#sidebar .lists {
		-moz-columns: 2;
		-webkit-columns: 2;
		columns: 2;
		text-align: center;
	}
	ul { margin-left: 0; padding-left: 1.5em; margin-top: 1em; }

	footer { 
		padding: 8px 2px;
		background: #ebebeb;
	}
	#footer-nav {
		columns: 2; -moz-columns: 2; -webkit-columns: 2; 
        column-gap: 2px; -moz-column-gap: 2px; -webkit-column-gap: 2px; 
	}
	#footer-nav a {
		display: block;
		padding: .7em;
		border-radius: 4px;
		margin-bottom: 2px;
		font-weight: bold;
		font-size: 1.2em;
		color: #000;
		text-shadow: 0 1px 0 #fff;
background: #A9EA28; /* Old browsers */
background: -moz-linear-gradient(top,  rgba(157,213,58,1) 0%, rgba(161,213,79,1) 50%, rgba(128,194,23,1) 51%, rgba(124,188,10,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(157,213,58,1)), color-stop(50%,rgba(161,213,79,1)), color-stop(51%,rgba(128,194,23,1)), color-stop(100%,rgba(124,188,10,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(157,213,58,1) 0%,rgba(161,213,79,1) 50%,rgba(128,194,23,1) 51%,rgba(124,188,10,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(157,213,58,1) 0%,rgba(161,213,79,1) 50%,rgba(128,194,23,1) 51%,rgba(124,188,10,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(157,213,58,1) 0%,rgba(161,213,79,1) 50%,rgba(128,194,23,1) 51%,rgba(124,188,10,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(157,213,58,1) 0%,rgba(161,213,79,1) 50%,rgba(128,194,23,1) 51%,rgba(124,188,10,1) 100%); /* W3C */
}
	#footer-nav a:hover, #footer-nav a:active {
		color: #fff;
		text-shadow: 0 -1px 0 #000;
		background: rgb(145,95,203); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(145,95,203,1) 0%, rgba(134,71,193,1) 50%, rgba(92,0,168,1) 51%, rgba(151,55,219,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(145,95,203,1)), color-stop(50%,rgba(134,71,193,1)), color-stop(51%,rgba(92,0,168,1)), color-stop(100%,rgba(151,55,219,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(145,95,203,1) 0%,rgba(134,71,193,1) 50%,rgba(92,0,168,1) 51%,rgba(151,55,219,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(145,95,203,1) 0%,rgba(134,71,193,1) 50%,rgba(92,0,168,1) 51%,rgba(151,55,219,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(145,95,203,1) 0%,rgba(134,71,193,1) 50%,rgba(92,0,168,1) 51%,rgba(151,55,219,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(145,95,203,1) 0%,rgba(134,71,193,1) 50%,rgba(92,0,168,1) 51%,rgba(151,55,219,1) 100%); /* W3C */
}	
}
@media ( max-width: 440px ) {
	header { padding: .7em 1em 1em; }
	header .black-btn { display: none; }
	header .logo { max-width: 50%; }
	header h2 { font-size: 1em; }
	#sidebar .lists, #footer-nav {
		columns: 1; -moz-columns: 1; -webkit-columns: 1;
	}
	header > img.logo {
		max-width: 75%;
	}
}
@media ( max-width: 359px ) {
	body { font-size: 16px; }
	header { border-bottom: 5px solid #A9EA28; margin-bottom: 0; }
	header h2 { display: none; }
	header .home-link {
		max-width: 50%;
	}	
	#content { padding: 1em; }
	a.black-btn {
		background: rgb(62,62,62); /* Old browsers */
		background: -moz-linear-gradient(top,  rgba(125,126,125,1) 0%, rgba(0,0,0,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(125,126,125,1)), color-stop(100%,rgba(0,0,0,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(125,126,125,1) 0%,rgba(0,0,0,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(125,126,125,1) 0%,rgba(0,0,0,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(125,126,125,1) 0%,rgba(0,0,0,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(125,126,125,1) 0%,rgba(0,0,0,1) 100%); /* W3C */
	}

}