@charset "UTF-8";
/*-- CSS Document for HedgeWall.com --*/
/*-- Colors: eaf1e3, d5e4c7, c0d6aa, abc98e, 96bb72, 718c56, 4b5e39, 262f1c, 000000  --*/

html {
	background: #d5e4c7;
}
body {
	width: 85%;
	height: auto;
	margin: 0px auto;
	background: white;
	font-family: "Myriad Set Pro", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
	font-size: 1em;
	font-weight: normal;
	font-style: normal;
	line-height: 1.3em;
	min-width: 305px;
	max-width: 1280px;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-moz-font-feature-settings: 'liga', 'kern';
}

p { 
	font-size: inherit;
	font-weight: normal;
	margin: 0px 0px 0px 0px;
	padding: 2px 4px 4px 6px;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: normal;
	margin: 0px 0px 0px 0px;
	background-color: #eaf1e3;
}
h1 { 
	font-size: 1.65em;
	padding: 8px 4px 4px 4px;
}
h2 {
	font-size: 1.46em;
	padding: 6px 4px 4px 4px;
}
h3 {
	font-size: 1.22em;
	padding: 4px 4px 4px 4px;
	background-color: transparent;
}



/*---------- Page Header and Logo ----------*/
#page-header {
	width: 100%;
	padding-top: 1px;
	overflow: hidden;
	margin-bottom: 0em;
}

#page-header h1 {
	padding-left: 92px;
	line-height: 76px;
	width: 200px;
	margin: 0 auto;
	margin-left: 8px;
	font-size: 2.16em;
	font-weight: normal;
	font-family: Verdana, Geneva, sans-serif;
	float: left;
	display: inline;
	background-image: url(media/img/hdgwl_logo_main.svg);
	background-position: left, center;
	background-repeat: no-repeat;
	background-color: transparent;
	background-size: contain;
}
#page-header a {
	color: #718c56;
	text-decoration: none;
	border: none;
}


/*---------- Navigation Styles ----------*/
nav ul {
	list-style: none;
}
nav a {
	color: black;
	text-align: center;
	text-decoration: none;
	border: none;
}
nav a:hover{
	color: white;
	background-color: #718c56; 
}


/*---------- Main Site Navigation ----------*/
#main-navigation h2 {display: none; /* Used for HTML outline marking, but not actully displayed */	}
#main-navigation a.skip {display: none; /* Used for accessibility option to skip main navigation */   }

#main-navigation {
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;	
}
#main-navigation ul {
	padding: 0px;
	margin: 0px 0px 6px 0px;
	background: #abc98e;
	overflow: hidden;	
}
#main-navigation a {
	font-size: 1.10em;
	float: left;
	padding: 8px 6px 8px 6px;
}
#main-navigation a.current {
	background: #eaf1e3;
	cursor: default;
}
#main-navigation a.current:hover{
	color: black;
}

/*---------- Submenu Navigation ----------*/
#sub-navigation h2 {display: none; /* Used for HTML outline marking, but not actully displayed */	}
#sub-navigation a.skip {display: none; /* Used for accessibility option to skip main navigation */   }

#sub-navigation ul {
	padding: 0px;
	margin: 0px 0px 8px 0px;
	background: #c0d6aa;
	overflow: hidden;	
}
#sub-navigation a {
	font-size: 1em;
	float: left;
	padding: 4px 8px 4px 8px;
}
#sub-navigation a.current {
	background: #eaf1e3;
	cursor: default;
}
#sub-navigation a.current:hover{
	color: black;
}

/*---------- Content Styling of Main Sections ----------*/
.header-icon {	
	background-position: 4px, center;
	background-repeat: no-repeat;
	background-size: 28px 28px;
}
h2.header-icon {
	padding-left: 36px;	
}
.support-tools-icon {
	background-image: url(media/img/support/tools-icon.svg);	
}
.docs-icon {
	background-image: url(media/img/doc-icon.svg);
}
.person-icon {
	background-image: url(media/img/about/person-icon.svg);	
} 
.mail-icon {
	background-image: url(media/img/about/mail-icon.svg);
}
.feedback-icon {
	background-image: url(media/img/about/feedback-icon.svg);
}
.tech-icon {
	background-image: url(media/img/tech-icon-02.svg);
}
.product-icon {
	background-image: url(media/img/product-icon-02.svg);	
}
.gear-icon {
	background-image: url(media/img/support/gear-icon.svg);	
}
.saga-icon {
	background-image: url(media/img/saga-icon.svg);
}
.corporeal-icon {
	background-image: url(media/img/corporeal-icon.svg);
}
.trackstar-icon {
	background-image: url(media/img/trackstar-icon.svg);
}
.countonit-icon {
	background-image: url(media/img/countonit-icon.svg);
}

.video-trailer {
	width: 100%;
	height: 100%;	
}

.bigpicture {
	width: 100%;
	height: 100%;	
}
.largepicture {
	width: 85%;
	height: 85%;
}

/*------------ Legal page styles ------------*/
h1.legal {
	text-align: center;	
}

a.legal {
	padding: 2px;
	color: #718c56;
	border: none;	
}
a.legal:hover {
	color: #abc98e;
}

article.legal {
	float: left;
}

section.legal {
	border: 1px solid #eaf1e3;
	padding: 0px 0px 0px 0px;
	margin-top: 12px;
	margin-left: 2%;
	margin-right: 8px;
	margin-bottom: 10px;
}

section.solo {
	border: 1px solid #eaf1e3;
	padding: 0px 0px 0px 0px;
	margin-top: 12px;
	margin-right: 2%;
	margin-bottom: 12px;
	margin-left: 2%;
}

dt {
	color: #4b5e39;
}
dd {
	margin-left: 16px;
}

/*---------- Footer Styling ----------*/
#page-footer {
	clear: both;
	background: #abc98e;
}

#page-footer h2{display: none; /* Used for HTML outline model marking, but not actully displayed */}

#footer-navigation a {
	font-size: 0.90em;
	float: right;
	padding: 4px 6px 4px 6px;
}

.footer-tail {
	font-size: 0.8em;
	text-align: right;
	line-height: 0.95em;
	background: #718c56;
	padding: 4px 2px 2px 0px;
	margin: 0px 0px 0px 0px;
	color: #d5e4c7;
	clear: both;
}

/*------------- Design Notes Page ----------*/
section.design {
	border: 1px solid #eaf1e3;
	padding: 0px 0px 0px 0px;
	margin-top: 12px;
	margin-right: 2%;
	margin-bottom: 12px;
	margin-left: 2%;
	clear: both;
	overflow: hidden;
}
div.block {
	float: left;
	height: 75px;
	width: 75px;
}
.bigicon {
	float: left;
	height: 150px;
	width: 150px;	
}
.biglogo {
	height: 300px;
	width: 300px;
}

/*---------- Form Styling ----------*/
form {
	padding: 5px;
	background-color: #eaf1e3;
}
.formfullwidth {
	width: 97%;	
}
.formbutton {
	background-color: #abc98e;
	border-style: solid;
	border-color: #C0D6AA;
	border-width: thin;
	border-radius: 5px;
	text-align: center;
	padding: 5px;
	width: 90px;
	margin-left: 8px;
}
.formbutton:hover {
	background-color: #eaf1e3;
}

.headerFit { /*used to make the form look like one sheet*/
	margin-bottom: 0px;	
}
.formnotes {
	font-size: 0.8em;	
}

/*---------- Table Styling ----------*/
table {
	border: solid 1pt #718c56;
	border-collapse: collapse;
	margin-left: 5%;
}
caption {
	font-size: 1.15em;
	background-color: #eaf1e3;
}
th {
	padding: 3px 4px;
	text-align: left;
	font-weight: normal;
	background-color: #c0d6aa;
}
tr:nth-child(even) {
	background-color: #eaf1e3;
}
td {
	border: solid 1pt #718c56;
	padding: 4px 6px;
}

/*-------------------- Mobile Screen Styles --------------------*/
@media only screen and (max-width:480px) {
body {
	width: 90%;
	line-height: 1.18em;	
}
h1 {
	font-size: 1.38em;	
}
h2 {
	font-size: 1.18em;
}

#page-header h1 {
	padding-left: 62px;
	line-height: 48px;
	font-size: 1.64em;
}

#main-navigation a {
	font-size: 1em;
	padding: 8px 3px 8px 3px;
}

#sub-navigation a {
	font-size: 0.90em;
	padding: 4px 4px 4px 4px;
}

#footer-navigation a.skip { /*-- Used to simlipy the footer menu on a small screen --*/
	display: none;
}
#footer-tail {
	font-size: 0.5em;
}

.column1 {
	margin-top: 8px;
	margin-bottom: 8px;
}

.column2 {
	margin-top: 8px;
	margin-bottom: 8px;
}

}



/*-------------------- Tablet Screen Styles --------------------*/
@media only screen and (min-width:481px) and (max-width:768px) {
body {
	width: 90%;
}

#page-header h1 {
	padding-left: 72px;
	line-height: 58px;
	font-size: 1.80em;
}
#sub-navigation a {
	font-size: 0.95em;
	padding: 4px 6px 4px 6px;
}
h1 {
	font-size: 1.46em;
}
h2 {
	font-size: 1.24em;
	margin-bottom: 4px;
}

.column1 {
	margin-top: 12px;
	margin-bottom: 8px;
}

.column2 {
	margin-top: 12px;
	margin-bottom: 8px;
}

}



/*-------------------- Desktop Screen Styles --------------------*/
@media only screen and (min-width:769px) {
body {
	line-height: 1.5em;	
}

h1{
	margin-top: 14px;
	margin-bottom: 14px;
}

h2{
	margin-bottom: 2px;
}

#main-navigation ul {
	margin: 0px 0px 8px 0px;
}


.column1 {
	float: left;
	width: 52%;
	border: 1px solid #eaf1e3;
	padding: 0px 0px 0px 0px;
	margin-top: 12px;
	margin-left: 2%;
	margin-right: 10px;
	margin-bottom: 10px;
}
.column2 {
	float: right;
	width: 40%;
	border: 1px solid #eaf1e3;
	padding: 0px 0px 0px 0px;
	margin-top: 12px;
	margin-left: 2%;
	margin-right: 10px;
	margin-bottom: 10px;
}

section.legal {
	float: left;
	width: 46%;
	min-height: 234px;
}


}