body {
	FONT-SIZE: 13px; COLOR: #3f4040; line-height:200%; FONT-FAMILY: Arial, Helvetica, sans-serif; background-color:#F6F5F5;
	PADDING: 0px; MARGIN: 0px;
}
h1 {
	font-size: 21px;
	color: #A80000;
	font-weight: bold;
	font-family: Trebuchet MS;
	margin-top:5px; margin-bottom:4px; vertical-align:bottom;
}
h2 {
	font-size: 18px;
	color: #163382;
	font-weight: normal;
	font-family: Trebuchet MS;
	line-height:15px;
}
h3 {
	font-size: 16px;
	color: #a80000;
	font-weight: normal;
	font-family: arial;
	text-align:left;
	line-height:15px;
}
.head1 {font-size: 26px;	color: #163382;	font-weight: 600;	line-height:40px;}
.head2 {font-size: 22px;	color: #a80000;	font-weight: normal;	line-height:30px;}
.head3 {font-size: 22px;	color: #163382;	font-weight: 600;	line-height:40px; border-bottom:1px solid #163382;}

.bodydiv {width:88%;min-height: 500px; margin:auto;padding:3px 8px; background:#FFFFFF; border-left:1px solid #A80000; border-right:1px solid #A80000;}
.fleft {float:left;}
.fright {float:right;}
.clear {clear: both;}
.double_line {border-bottom:double #A80000;}
.mainmenu {
	width: 1000px;margin: auto; 
}
.mainmenu ul{
	list-style: none;	margin: 0; padding: 0;
}
.mainmenu ul li {
	list-style: none; margin: 0px; padding: 0 10px; float:left;
	font-size: 12px; font-weight: bold;	color:#FFFFFF; border-right: solid 1px #5A6EA4;text-align:center;
}
.mainmenu ul li div {	
	font-size: 11px; font-weight: normal;	color:#FFFFFF;
}
.mainmenu ul li a:link, .mainmenu ul li a:visited {
	font-size: 12px; font-weight: bold;	color:#FFFFFF;
	text-decoration: none;
}
.mainmenu ul li a:hover, .mainmenu ul li.active a{
	color:#00FFFF;
}
.i {
	FONT-WEIGHT: bold; FONT-SIZE: 18px; COLOR: #598527; FONT-FAMILY: Arial; TEXT-DECORATION: underline; 
}
.i:link {
	FONT-WEIGHT: bold; FONT-SIZE: 18px; COLOR: #598527; FONT-FAMILY: Arial; TEXT-DECORATION: underline; 
}
.i:hover {
	FONT-WEIGHT: bold; FONT-SIZE: 18px; COLOR: #000000; FONT-FAMILY: Arial; TEXT-DECORATION: none;
}
.imgbor {
	BORDER-RIGHT: #cbcaca 1px solid; PADDING-RIGHT: 3px; BORDER-TOP: #cbcaca 1px solid; PADDING-LEFT: 3px; PADDING-BOTTOM: 3px; BORDER-LEFT: #cbcaca 1px solid; PADDING-TOP: 3px; BORDER-BOTTOM: #cbcaca 1px solid; BACKGROUND-COLOR: #fff
	}
.button {
	background-color:#07487e; cursor:pointer; padding: 5px 25px;color:#FFFFFF;font-size:14px; font-weight:600;text-align:left;
	border: solid 1px #022441;-webkit-border-radius:6px;	-moz-border-radius:6px;	border-radius:6px;
	-moz-box-shadow: 0 0 1px 1px #0E1A34;	-webkit-box-shadow: 0 0 1px 1px #0E1A34;	box-shadow: 0 0 1px 1px #0E1A34;
}
.button:hover {
	background-color:#085c74;
}
.button_1 {
	height:36px;	background-color:#173283; cursor:pointer; padding-left: 15px;padding-right: 15px; 
	color:#FFF;font-size:14px; font-weight:500; text-decoration: none; text-align:center;
	border: solid 1px #173283;-webkit-border-radius:2px;	-moz-border-radius:2px;	border-radius:2px; width:160px;
}
.button_1:hover, a.button_1:hover {
	background-color:#163381;color:#CCC;
}
a.button_1 {padding-top: 5px;padding-bottom: 5px;}
.hint{
FONT-SIZE: 11px; COLOR: #FF3333; FONT-FAMILY: "verdana";
}
.black{
FONT-SIZE: 11px; COLOR: #ffffff; FONT-FAMILY: "Trebuchet MS"; font-weight:normal; line-height:25px;
}
.color{
FONT-SIZE: 21px; COLOR: #0655a9; FONT-FAMILY: "Trebuchet MS"; font-weight:normal;
}
.color4{
FONT-SIZE: 21px; COLOR: #333333; FONT-FAMILY: "Trebuchet MS"; font-weight:normal;
}
.colorquicks{
FONT-SIZE: 19px; COLOR: #ffffff; FONT-FAMILY: "Trebuchet MS"; font-weight:normal;
}
.tb {width:220px;height: 22px;line-height:22px;border: solid 2px #d1d1d1;padding-left:3px;color:#666666;font-size:14px;}
.box01 {text-align:left;padding:2px 20px; border: solid 1px #CCCCCC;}
.box01 a:link, .box01 a:visited{ color: #555555;font-size: 14px; font-weight: bold;text-decoration: none;}
.box01 a:hover{ color: #990000;}
.table {border: solid 1px #CCCCCC; border-collapse: collapse;}
a.link:link, a.link:visited  {font-size: 12px; font-weight: bold; color:#FFFFFF; text-decoration:none;}
a.link:hover {text-decoration:underline;}
a.link1:link, a.link1:visited  {font-size: 14px; font-weight: bold; color:#012653; text-decoration:none;}
a.link1:hover {text-decoration:underline;}
a.tdnone {text-decoration:none;}
a.link2 {font-size: 20px; color:#0066FF; font-weight: 500; text-decoration:none;}
a.link2:hover {color:#990066;}

a.link3 {font-size: 14px; color:#0066FF; font-weight: 600; text-decoration:none;}
a.link3:hover {color:#990066;}

.button2 {
	width: 280px;	height: 57px;
	background: url(../images/btnbg.jpg) top no-repeat;
	color:#FFFFFF; font-size: 18px; font-weight: 500; font-family: Arial;	text-decoration: none;	
}
.button2:hover {
	background: url(../images/btnbg.jpg) bottom no-repeat;
}
.button2 a{color:#FFFFFF; font-size: 18px; font-weight: 500; font-family: Arial;text-decoration: none;line-height: 23px;}
.button2 a div{margin:0;padding-left:50px; padding-top: 5px;}

.label {font-size:12px;font-family:verdana;color:#222222;}
.value {font-size:13px;font-family:verdana;color:#222222;padding-left:7px;}
.readonly {background:#FFFFBB;}
.tb01 {height: 15px;line-height:15px;border: solid 1px #d1d1d1;font-size:12px;}
.tbox40 {padding:2px;border: solid 1px #7F9DB9;width:250px;}
.tbox30 {padding:2px;border: solid 1px #7F9DB9;width:230px;}
.tbox20 {padding:2px;border: solid 1px #7F9DB9;width:100px;}
.tbox10 {padding:2px;border: solid 1px #7F9DB9;width:60px;}
.tbox5 {padding:2px;border: solid 1px #7F9DB9;width:40px;}

.btop {
	width:278px;
	height:36px;
	background: url(../images/b-top.jpg) bottom center no-repeat;
	line-height: 35px;
	color: #FFFFFF;text-align:center;font-size: 1.5em; font-weight: bold; font-family: "Times New Roman";
}
.bmid {
	width:278px;
	min-height:100px;
	background: url(../images/b-mid.jpg) center repeat-y;text-align:left;
}
.bbot {
	width:278px;
	height:12px;
	background: url(../images/b-bot.jpg) top center no-repeat;
}
.success {
	background: #99FFCC;	border: solid 1px #CCCCCC; position:absolute;top:70px;left:10%; width:80%;
	padding:10px 1px;margin:2px 5px;-webkit-border-radius:5px;	-moz-border-radius:5px;	border-radius:5px;
	-moz-box-shadow: 0 0 1px 1px #CCCCCC;	-webkit-box-shadow: 0 0 1px 1px #CCCCCC;	box-shadow: 0 0 1px 1px #CCCCCC;
	text-align:center; color:#111111;font-size:12px; font-weight: bold;
}
.error {
	background: #D15263;	border: solid 1px #CCCCCC; position:absolute;top:70px;left:10%; width:80%;
	padding:10px 1px;margin:2px 5px;	-webkit-border-radius:5px;	-moz-border-radius:5px;	border-radius:5px;
	-moz-box-shadow: 0 0 1px 1px #CCCCCC;	-webkit-box-shadow: 0 0 1px 1px #CCCCCC;	box-shadow: 0 0 1px 1px #CCCCCC;
	text-align:center; color:#111111;font-size:12px; font-weight: bold;
}
#wrapper {width:300px; margin:50px auto}
.form {float:left; padding:0 10px 10px 10px; background:#f3f3f3; border:2px solid #cfcfcf;}
.form label {float:left; width:100px; padding:10px 10px 0 0; font-weight:bold}
.form select {float:left; width:146px; margin-top:10px}
.form input {float:left; margin-top:10px}
.form .submit {clear:both}
#msg {display:none; position:absolute; z-index:200; padding-left:7px;background:url(images/msg_arrow.gif) left center no-repeat;}
#msgcontent {display:block; background:#FFFF99; border:2px solid #c24848; border-left:none; padding:5px; min-width:150px; max-width:350px;}


/*
 * re: https://twitter.com/CodePen/status/355107665099231232
 *
 * this version uses <i> for the icons; this is the first time i've constructed icons out of pure css using pseudo elements (MUCH more on that here: http://css-tricks.com/pseudo-element-roundup/ )
 *
 * next version(s) might substitute the <i>s with @fontface & unicode range; i'd like to also try to get more semantic with this (though i think this is pretty semantic to start with... no? maybe not); i'd also like to get this modernizr'd and compatible way back to ie version who-knows-what
 *
 * feel free to hit me up w/criticisms @ jeremy.buller@gmail.com
 */

*,
*:before,
*:after {
  box-sizing: border-box;
}


.button-n {
  display: block;
  position: relative;
  padding: .56em 5em .56em 1em;
  border-radius: .25em;
  margin-bottom: .5em;
  background: #fff;
 box-shadow:
    0 .0625em .125em rgba(0, 0, 0, .125),
    inset 0 -.25em 0 -.125em rgba(0, 0, 0, .125),
    inset 1em 0 0 -.7em rgba(0, 95, 210, .5),
    inset -2em 0 0 -.3em rgba(0, 0, 0, .05);
}
 a.button-n{ text-decoration:none; font-size:14px; font-weight:bold; color:#163381;}
 .date{ font-size:12px; color:#036; }
.teach-me {
  box-shadow:
    0 .0625em .125em rgba(0, 0, 0, .125),
    inset 0 -.25em 0 -.125em rgba(0, 0, 0, .125),
    inset 1em 0 0 -.7em rgba(0, 95, 210, .5),
    inset -2em 0 0 -.3em rgba(0, 0, 0, .05);
}

.handyman {
  box-shadow:
    0 .0625em .125em rgba(0, 0, 0, .125),
    inset 0 -.25em 0 -.125em rgba(0, 0, 0, .125),
    inset 1em 0 0 -.7em rgba(20, 160, 0, .5),
    inset -2em 0 0 -.3em rgba(0, 0, 0, .05);
}

.pick-up-delivery {
  box-shadow:
    0 .0625em .125em rgba(0, 0, 0, .125),
    inset 0 -.25em 0 -.125em rgba(0, 0, 0, .125),
    inset 1em 0 0 -.7em rgba(210, 15, 0, .5),
    inset -2em 0 0 -.3em rgba(0, 0, 0, .05);
}

.item {
  font-weight: bold;
  color: #000;
  display: block;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.item:after {
  content: '';
  display: block;
  height: 0;
  width: 100%;
}

.meta {
  margin-left: .25em;
}

.category,
.expiry,
i {
  font-size: 12px;
  line-height: 2; /* 16 "px" */
}

.expiry {
  font-weight: bold;
}

.expiry:before {
  content: 'Date: ';
  font-weight: normal;
}

.cost {
  position: absolute;
  font-family: 'Pathway Gothic One', sans-serif;
  font-size: 2em;
  right: 1.125em;
  top: 0;
  line-height: 2.083; /* 50 "px", should be same as button height */
}

.clock {
  display: inline-block;
  position: relative;
  width: 1.333em;
  height: 1.333em;
  margin-left: .333em;
  border: .25em solid #95979d;
  border-radius: 50%;
  vertical-align: middle;
}

.clock:before,
.clock:after {
  content: '';
  display: block;
  position: absolute;
  width: .125em;
  height: .25em;
  background: #95979d;
}

.clock:before {
  left: 50%;
  bottom: 47%;
  margin-left: -.0625em;
}

.clock:after {
  transform: rotate( 135deg );
  left: 63%;
  top: 47%;
}

.chevron {
  display: block;
  width: 1em;
  height: 1em;
  font-size: .75em;
  position: absolute;
  right: .667em;
  top: 50%;
  margin-top: -.6em; /* just eyeballing it */
}

.chevron:before,
.chevron:after {
  content: '';
  display: block;
  position: absolute;
  background: rgba(0, 0, 0, .125);
  width: .5em;
  height: .5em;
  right: .25em;
  top: 50%;
}

.chevron:before {
  transform: skewX( 45deg );
  top: 0;
  box-shadow: inset -.125em .125em .125em rgba(0, 0, 0, .25);
}
.chevron:after {
  transform: skewX( -45deg );
  bottom: 0;
  box-shadow: inset .25em .125em .125em -.125em rgba(0, 0, 0, .25);
}