body {

  height:100%;

  width:100%;

	margin:0;

	padding:0;

}

#header {

  background: white;

  position:static;

  top:0;

  left:0;

  height:7%;

  right:0;

  overflow:auto;

  text-align: center;

}

.topnav {

  position:static;

 /* top:7%; */

  left:0;

  height:3%;

  right:0;

  overflow:auto;

  text-align: center;

  background-color: #397650; 

}

.topnav a  {

	display:inline;

  padding: 0;

  background-color: #397650;

  text-align: center;

  padding: 0 16px;

  text-decoration: none;

  font-size: 12px;

  color:white;

}

.topnav a:hover {

  background-color: #254d34;

  color: black;

}

.topnav a.active {

  background-color: #397650;

  color: white;

}

.topnav .icon {

  display: none;

}

#content {

  position:static;

 /* top:10%;

  bottom:5%;*/

  left:0;

  right:0;

  overflow:auto;

  text-align: center;

  width:100%;

}

#footer {

  background: #397650;

  position:static;

  bottom:0;

  height:5%;

  left:0;

  right:0;

  overflow:auto;

  font-size: 12px;

  text-align: center;

 	color: white;

}

#footer a{

	font-family: verdana;

	text-decoration: none;

	 color: white;

}

#footer a:hover {

	font-family: verdana;

	font-weight: bold;

	color: #254d34;

}

.homelinks{

  display: inline-block;

	width:400px; 

	height:80px;

	padding:15px;

	font-family: verdana;

	font-size: 28px;

	text-align:center;

	background-image:url('/images/homelinks.gif')

}

.homelinks a:hover{

	background-image:url('/images/homelinksmo.gif')

}

a {

	font-family: verdana;

	font-size: 12px;

	color: black;

	font-weight: bold;

	text-decoration: none;

}

a:hover {

	font-family: verdana;

	font-size: 12px;

	font-weight: bold;

	color: black;

	text-decoration: none;

}

a:visited {

	font-family: verdana;

	font-size: 12px;

	font-weight: bold;

	text-decoration: none;

}

p {

	font-family: verdana;

	font-size: 12px;

	color: #000000;

	margin: 3px;

	padding: 3px 0;

}

* {

  box-sizing: border-box;

}

/* Create three equal columns that floats next to each other */

.column {

  float: left;

  width: 33.33%;

  padding: 10px;

}

.columnd {

  float: left;

  width: 66.66%;

  padding: 10px;

}

/* Create six equal columns that floats next to each other */

.columnp{

  float: left;

  width: 16.66%;

  padding: 10px;

}

/* Clear floats after the columns */

.row:after {

  content: "";

  display: table;

  clear: both;

}

.department{

  left:0;

  height:3%;

  right:0;

  text-align: center;

  background-color: #397650;

  color:white;

	font-size: 1em;

	font-weight: bold;

}

.product{

	border-style: solid;

	border-radius: 5px;

	padding: 10px;

   text-align: center;

}

input[type=button], input[type=submit], input[type=reset] {

  background-color: #397650;

  border: none;

  color: white;

  padding: 2px 2px;

  text-decoration: none;

  margin: 2px 2px;

  cursor: pointer;

  font-size: 12px;

  border-radius: 8px;

  min-width:30px;

  min-height:30px;

 }

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

.pimg {

  width:100px;

  height: 100px;

  border-style: none;

}

.pspan{

  border-style: none;

  padding:2px 0 2px 0;

   margin: 0 auto

}

h1 {

  font-family: Verdana, arial, sans-serif;

  font-size: 1.6em;

  padding: 0.8em 0 0.5em;

  font-weight: 700;

  margin: 0;

  line-height: 1.3em;

}

h2 {

  font-family: Verdana, arial, sans-serif;

  font-size: 1.45em;

  padding: 0.7em 0 0.4em;

  font-weight: 200;

  margin: 0;

  line-height: 1.1em;

}

h3 {

  font-family: Verdana, arial, sans-serif;

  font-size: 1.3em;

  padding: 0.8em 0 0.5em;

  font-weight: 700;

  margin: 0;

  line-height: 1.3em;

}

h4 {

  font-family: Verdana, arial, sans-serif;

  font-size: 1.15em;

  padding: 0.7em 0 0.4em;

  font-weight: 200;

  margin: 0;

  line-height: 1.1em;

  text-align: left;

}

hr {

	color: #9966CC;

	padding: 2px;

	background-color: #000000;

}

/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */

@media screen and (max-width: 600px) {

  .column {

    width: 100%;

  }

    .columnp {

    width: 100%;

  }

  .topnav a:not(:first-child) {display: none;}

  .topnav a.icon { float: right; display: block;}

  .topnav .responsive {position: absolute; height:15%;z-index:9999;}

  .topnav .responsive .icon { position: absolute; right: 0; top: 0;}

  .topnav .responsive a { float: none;  display: block; text-align: left; }

}