body
{
  background: White url(grad.gif) repeat-y center;
  text-align: center;
  margin-top: 0px;
  margin-bottom: 0px;
}


#content
{
  font: 14px "Trebuchet MS", Arial, Verdana, sans-serif;
  color: #333333;
  text-align: left;
  width: 800px;
  margin-left: auto;
  margin-right: auto;
  background-color: White;
  border: thin solid #C0C0C0;
}

#content2
{
  font: 14px "Trebuchet MS", Arial, Verdana, sans-serif;
  color: #333333;
  text-align: left;
  width: 800px;
  margin-left: auto;
  margin-right: auto;
  background-color: White;
  border: thin solid #C0C0C0;
  border-top: none;
  border-bottom: none;
}

p
{
  font: 14px "Trebuchet MS", Arial, Verdana, sans-serif;
  color: #333333;
  margin: 0px 40px 20px 40px
}

h1
{
  font: bold 18px Verdana, Arial, Helvetica, sans-serif;
  color: #800000;
  text-align: center;
  margin: 20px 40px 20px 40px
}

h2
{
  font: bold 18px Verdana, Arial, Helvetica, sans-serif;
  color: #800000;
  text-align: center;
  margin: 20px 40px 20px 40px
}
h2.likep {
        font: 14px "Trebuchet MS", Arial, Verdana, sans-serif;
    color: #333333;
    margin: 0px 40px 20px 40px;
    text-align:left;
}

h3
{
  font: bold 14px Verdana, Arial, Helvetica, sans-serif;
  color: #0B4597;
  text-align: left;
  margin: 0px 40px 5px 40px
}

.navy
{
  font: bold 16px Verdana, Arial, Helvetica, sans-serif;
  color: #0B4597;
  text-align: left;
  margin: 0px 40px 30px 40px
}

.bodyboldhighlightred {
 font: bold 14px Verdana, Arial, Helvetica, sans-serif;
 color: #800000;
 background: #FFFFFF;
}

.bodyboldyello {
font: bold 14px "Trebuchet MS", Arial, Verdana, sans-serif;
color: #000000;
background: #ffff00;
}

form p
{
  clear: left;
  margin: 0px 40px 20px 40px;
  padding-top: 5px;
}

form p label
{
  float: left;
  width: 35%;
  font: bold 14px "Trebuchet MS", Arial, Verdana, sans-serif;
}

.submit
{
 text-align: center;
 color: #800000;
 font: bold 14px Verdana, Arial, Helvetica, sans-serif;
 margin: 0px 40px 20px 40px;
}

textarea
{
   width: 383px;
   height: 246px;
}

.footer
{
  font: 12px "Trebuchet MS", Arial, Verdana, sans-serif;
  color: #333333;
  text-align: center;
  margin: 20px 40px 0px 40px;
}

.footermargin
{
  font: 12px "Trebuchet MS", Arial, Verdana, sans-serif;
  color: #333333;
  text-align: center;
  margin: 0px 40px 20px 40px;
}

.nolink
{
  font: 12px "Trebuchet MS", Arial, Verdana, sans-serif;
  color: #333333;
  text-align: center;
  margin: 0px 40px 20px 40px;
}

.nolink a:link, .nolink a:visited
{
   text-decoration: none;
   color: #333333;
   background-color: white;
}

.nolink a:hover, .nolink a:active
{
   text-decoration: none;
   color: #333333;
   background-color: white;
}

a:link, a:visited
{
   text-decoration: underline;
   color: #6A5ACD;
   background-color: transparent;
}

a:hover, a:active {
   text-decoration: underline overline;
   color: #191970;
   background-color: #C9C3ED;
}

.left
{
  float: left;
  margin: 0px 40px 20px 40px
}

td, th
{
	font: 0.8em Verdana, Geneva, Arial, Helvetica, sans-serif;
    margin: 0px 40px 20px 40px
}

.datatable
{
	border: 1px solid #D6DDE6;
	border-collapse: collapse;
    margin: 0px 40px 20px 40px
}

.datatable td
{
	border: 1px solid #D6DDE6;
	text-align: right;
	padding: 4px;
    margin: 0px 40px 20px 40px
}

.datatable th
{
	border: 1px solid #828282;
	background-color: #BCBCBC;
	font-weight: bold;
	text-align: left;
	padding: 4px;
    margin: 0px 40px 20px 40px
}

.datatable caption
{
	font: bold 0.9em "Times New Roman", Times, serif;
	background-color: #B9D5E0;
	color: #33517A;
	padding-top: 3px;
	padding-bottom: 2px;
	border: 1px solid #789AC6;
    margin: 0px 40px 0px 40px
}

li
{
  font: 14px "Trebuchet MS", Arial, Verdana, sans-serif;
  color: #333333;
  background-color: White;
  list-style: none outside url(checkmark.gif);
  margin: 0px 40px 0px 40px;
  padding-bottom: 1em;
}

.right
{
  float: right;
  margin: 0px 35px 10px 0px;
}

.left
{
  float: left;
}



/*New CSS*/
@media only screen and (min-width:100px) and (max-width: 815px) {
	#content{width:100%;}
	#content2{width:100%;}
	.trade-contractor{width:100%;height: 100%;}
	}

@media only all and (min-width:100px) and (max-width: 300px) {
	form p input{width:100%;}
	form p select{width:100%;}
	.steve-butler{width:100%;}
}
	
@media only all and (min-width:100px) and (max-width: 480px) {
	.hate-spam{width:100%;height:100%;}
	h2{font-size: 1.4em;margin: 10px;}
	p{font-size: 1.1em;}
	form p label{width:100%; font-size:1em;}
	textarea{width: 100%;height: 150px;}
	.footer{font-size: 0.9em;}
	.nolink{font-size: 1em;}
}

@media only all and (min-width:481px) and (max-width: 640px) {
	h2{font-size: 1.4em;margin: 10px;}
	p{font-size: 1.1em;}
	.footer{font-size: 0.9em;}
	.nolink{font-size: 1em;}
}

@media only all and (min-width:641px) and (max-width: 899px) {
	h2{font-size: 1.4em;}
	p{font-size: 1.1em;}
	form p label{font-size: 1em;}
	.footer{font-size: 0.9em;}
	.nolink{font-size: 1em;}
}
@media only all and (min-width:900px) and (max-width: 1024px) {
	h2{font-size: 1.4em;}
	p{font-size: 1.1em;}
	form p label{font-size: 1em;}
	.footer{font-size: 0.9em;}
	.nolink{font-size: 1em;}
}