html,body{margin:0;padding:0}
body{font-family:Arial,sans-serif;font-size:14px;color: #000;text-align:center;padding: 20px}
h1,h2,h3{padding-left: 15px;margin: 0}
h1{font-size: 160%;color: #555}
h2{font-size: 140%;color: #555}
h3{font-size: 120%;color: #555}
p{margin: 0;padding: 0 15px 0.7em;line-height: 1.5}
address{font-style: normal}
.errmsg {
   background-color:#FFFFFF;
   border-right:1px solid #aaa;
   border-left:1px solid #aaa;
   font-size: 14px;
   background-color:#FFFFFF;
   color:red;
}
.odd {
   background-color: #E7E7E7;
}
.even {
   background-color: #FFFFFF;
}
div.gradient{background: #F2F2F2 url('../img/gradient.png') repeat-x top;margin: 15px}
div.gradient p{margin:0;padding: 2px 5px}
p.codehere{color: #2A4D91}

div#container{
   width: 100%;
   margin: 0 auto;
   background-color: #FFFFFF;
   text-align: left;
}
div#header{background-color: #e7e7e7;padding:10px 0}
div#header h1{
   color: Blue;
   font-size: 300%;
   font-weight: 900;
}
div#menu{width:100%;overflow:auto;background: #e7e7e7;padding-top: 5px}
ul#nav,ul#nav li{list-style-type:none;margin:0;padding:0}
ul#nav{padding-left:15px}
ul#nav li{float:left;width:80px;margin-right:2px;text-align: center}
ul#nav a{float:left;width:80px;text-decoration:none;background: #FFC;color: #999}
ul#nav li.active a,ul#nav a:hover{color: #000}
div#content{
 width: 100%;
 border-top: 1px solid #999;
 margin: 0 auto;
 background-color: #C0CDF2;
}
div#footer{padding-top:5px;text-align:center;font-size:90%;background: #8395CB;color: #FFF}

div#box{float:right;display:inline;width:150px;margin: 5px 5px 5px 5px;background:#E4E7F2;text-align:center}
div#box p{padding:0 5px}
div#minipics{float:left;width:100%;padding-bottom:10px}
div#minipics ul{list-style-type: none;margin:0 15px;padding:0}
div#minipics li{float:left;width:100px;margin: 10px 10px 10px 0;background-color: #FFF}
div#minipics li img{display: block;width: 80px;height: 80px;margin:5px 10px;border: 0px}

div#who{float:right;display:inline;width:150px;margin: 15px 15px 0 5px;background:#e7e7e7;text-align:center}
div#who p{padding:0 5px}

div#payment{float:center;display:inline;width:250px;margin: 5px 5px 5px 5px;background:#E4E7F2;text-align:center}
div#payment p{padding:0 5px}

INPUT[type=text]:enabled {
    border: 1px solid #006;
    background: #ffc;
    width="100%";
}
INPUT[type=text]:disabled {
    border: 1px solid #006;
    background: #ddd;
    width="100%";
}
INPUT[type=checkbox] {
  transform: scale(1.5);
}
INPUT:hover {
    border: 1px solid #f00;
    background: #ff6;
    width="100%";
}
TEXTAREA {
  font-family:Arial,sans-serif;
  font-size:14px;
  color: #000;
  width: 300px;
  background: #ffc;
}
a.ovalbutton{
background: transparent url('../img/oval-orange-left.gif') no-repeat top left;
display: block;
float: left;
font: normal 13px Tahoma; /* Change 13px as desired */
line-height: 16px; /* This value + 4px + 4px (top and bottom padding of SPAN) must equal height of button background (default is 24px) */
height: 24px; /* Height of button background height */
padding-left: 11px; /* Width of left menu image */
text-decoration: none;
}
a:link.ovalbutton, a:visited.ovalbutton, a:active.ovalbutton{
color: #494949; /*button text color*/
}
a.ovalbutton span{
background: transparent url('../img/oval-orange-right.gif') no-repeat top right;
display: block;
padding: 4px 11px 4px 0; /*Set 11px below to match value of 'padding-left' value above*/
}
a.ovalbutton:hover{ /* Hover state CSS */
background-position: bottom left;
}
a.ovalbutton:hover span{ /* Hover state CSS */
background-position: bottom right;
color: black;
}
.ovalbutton{
background: transparent url('../img/oval-orange-left.gif') no-repeat top left;
display: block;
float: left;
font: normal 13px Tahoma; /* Change 13px as desired */
line-height: 16px; /* This value + 4px + 4px (top and bottom padding of SPAN) must equal height of button background (default is 24px) */
height: 24px; /* Height of button background height */
padding-left: 11px; /* Width of left menu image */
text-decoration: none;
}
.ovalbutton span{
background: transparent url('../img/oval-orange-right.gif') no-repeat top right;
display: block;
padding: 4px 11px 4px 0; /*Set 11px below to match value of 'padding-left' value above*/
}
.ovalbutton:hover{ /* Hover state CSS */
background-position: bottom left;
}
.ovalbutton:hover span{ /* Hover state CSS */
background-position: bottom right;
color: black;
}
.buttonwrapper{ /* Container you can use to surround a CSS button to clear float */
overflow: hidden; /*See: http://www.quirksmode.org/css/clearing.html */
width: 100%;
}

/*------------------------------------*\
   TABLES
\*------------------------------------*/
table{
   border-collapse:collapse;
   border-spacing:0;
}
.tg {border-color:#000;overflow:inherit;}
.tg caption{font-weight: bold; font-size: 1.5em;}
.tg td{padding:10px 5px;border-style:solid;border-width:1px;overflow:inherit;word-break:normal;border-color:#000;color:#000;background-color:#fff;}
.tg th{
   font-weight: bold;
   padding: 10px 5px;
   border-style: solid;
   border-width: 1px;
   overflow: hidden;
   word-break: normal;
   border-color: #000;
   color: #000;
   background-color: #b9c9fe;
}
.tg textarea{width: 90%;}
.tg .tg-hdr{
   text-align: center;
   vertical-align: top;
   background-color: #E7E7E7;
  font-size: 2em;
}
.tg .tg-evenrt{background-color:#DDE4F8;text-align:right;vertical-align:top}
.tg .tg-evenlt{background-color:#DDE4F8;text-align:left;vertical-align:top}
.tg .tg-evenctr{background-color:#DDE4F8;text-align:center;vertical-align:top}
.tg .tg-oddrt{text-align:right;vertical-align:top}
.tg .tg-oddlt{text-align:left;vertical-align:top}
.tg .tg-oddctr{text-align:center;vertical-align:top}

.sortable table{
   margin-bottom:20px;
   width:100%;
   background-color:#FFFFFF;
}
.sortable caption{
   margin-bottom:5px;
  text-align:center;
}
.sortable caption,tfoot{
   font-style:italic;
   font-weight:bold;
}
.sortable tfoot{
   text-align:center;
}
.sortable td,th{
   padding:5px;
   border:1px solid #333;
   font-size:.8em;
}
.sortable th:empty,
.sortable td:empty{
   padding:5px;
   border:1px solid #333;
   background-color:#FFFFFF
}
.sortable th{
   font-size:0.9em;
   color:#FFFFFF;
   background-color:#000000;
}
.sortable tbody tr:nth-of-type(odd){
/*------------------------------------*\
  white
\*------------------------------------*/  
     background:rgba(255, 255, 255, 1);
}

/* Dashed border */
hr.dashed {
  border-top: 3px dashed #bbb;
}

/* Dotted border */
hr.dotted {
  border-top: 3px dotted #bbb;
}

/* Solid border */
hr.solid {
  border-top: 3px solid #bbb;
}

/* Rounded border */
hr.rounded {
  border-top: 8px solid #bbb;
  border-radius: 5px;
}

/* @group Blink */
.blink {
   -webkit-animation: blink .75s linear infinite;
   -moz-animation: blink .75s linear infinite;
   -ms-animation: blink .75s linear infinite;
   -o-animation: blink .75s linear infinite;
    animation: blink .75s linear infinite;
}
@-webkit-keyframes blink {
   0% { opacity: 1; }
   50% { opacity: 1; }
   50.01% { opacity: 0; }
   100% { opacity: 0; }
}
@-moz-keyframes blink {
   0% { opacity: 1; }
   50% { opacity: 1; }
   50.01% { opacity: 0; }
   100% { opacity: 0; }
}
@-ms-keyframes blink {
   0% { opacity: 1; }
   50% { opacity: 1; }
   50.01% { opacity: 0; }
   100% { opacity: 0; }
}
@-o-keyframes blink {
   0% { opacity: 1; }
   50% { opacity: 1; }
   50.01% { opacity: 0; }
   100% { opacity: 0; }
}
@keyframes blink {
   0% { opacity: 1; }
   50% { opacity: 1; }
   50.01% { opacity: 0; }
   100% { opacity: 0; }
}
/* @end */
/* smart image enlarger starts here */
/* If your images are not linking to other pages leave the links as <a href="#nogo"> Otherwise enlarger won't work in IE6 */
.ienlarger {
 float: left;
 clear: none; /* set to left or right if needed */
 padding-bottom: 5px; /* space between thumbs. Don't change this to margin */
 padding-right: 5px; /* space between thumbs and wrapping text when there is any text around it */
}
.ienlarger a { 
 display:block;
 text-decoration: none;
/* add cursor:default; to this rule to disable the hand cursor */
}
.ienlarger a:hover{ /* don't move this positioning to normal state */
  position:relative;
}
.ienlarger span img {
 border: 1px solid #FFFFFF; /* adds a border around the image */
 margin-bottom: 8px; /* pushes the text down from the image */
}
.ienlarger a span {  /* this is for the large image and the caption */
 position: absolute;
 display:none;
 color: #FFCC00; /* caption text colour */
 text-decoration: none;
 text-align: center;
 font-family: Arial, Helvetica, sans-serif;
 font-size: 13px; /* caption text size */
 background-color: #000000;
 font-weight: bold;
 padding-top: 10px;
 padding-right: 10px;
 padding-bottom: 13px;
 padding-left: 10px;
}
.ienlarger img { /* leave or IE puts a border around links */
border-width: 0;
}
.ienlarger a:hover span { 
 display:block;
 top: 10px; /* means the pop-up's top is 10px away from thumb's top */
 right: 20px; /* means the pop-up's left is 20px far from the thumb's left */
 z-index: 100;
 
/* If you want the pop-up open to the left of thumb, remove the left: 90px; and add left: 90px; This would mean the right side of the pop-up is 90px far from the right side of thumb */ 
/* If you want the pop-up open above the thumb, remove the top: 50px; and add bottom: 50px; This would mean the bottom of the pop-up is 50px far from the bottom of thumb */ 
/* add cursor:default; to this rule to disable the hand cursor only for the large image */
}
.resize_thumb {
 width: 85px; /* enter desired thumb width here */
 height : auto;
}
/* smart image enlarger ends here */
/* specs hover starts here */
span.speclink {
   position: relative;
}
span.speclink a span {
  display: none;
}
span.speclink a:hover {
 font-size: 99%;
 font-color: #000000;
}
span.speclink a:hover span { 
 display: block; 
 position: absolute; 
 margin-top: 10px; 
 margin-left: -10px; 
 width: 375px; padding: 5px; 
 z-index: 100; 
 color: #000000; 
 background: #FFFFAA; 
 font: 12px "Arial", sans-serif;
 text-align: left; 
 text-decoration: none;
}
/* specs rollover ends here */