body {margin-top: 0px; background-color: #ffffff; font-family: sans-serif;
 scrollbar-arrow-color: #0000aa;
 scrollbar-face-color: #99ccff;
 scrollbar-3dlight-color: #dddddd;
 scrollbar-highlight-color: #000066;
 scrollbar-shadow-color: #777777;
 scrollbar-darkshadow-color: #000000;
 scrollbar-track-color: #eeeeee}
 
 
 
* {box-sizing: border-box;}
.row:after {content: ""; clear: both; display: block;}
[class*="col-"] {float: left; padding: 15px;}



.header1 {background-color: #10a0d0; font-size: 22pt; font-family: arial, helvetica, sans-serif; color: #000000; font-weight: 600; text-align: center; font-style: italic; padding: 5px;}

.header2 {background-color: #c9b510; font-size: 16pt; font-family: arial, helvetica, sans-serif; color: #000000; font-weight: 600; text-align: center; font-style:  normal; padding: 10px;}

.header3 {background-color: #60a060; font-size: 16pt; font-family: arial, helvetica, sans-serif; color: #000000; font-weight: 600; text-align: center; font-style:  normal; padding: 10px;}

.footer  {background-color: #005599; color: #ffffff; text-align: right; font-size: 12px; padding: 15px;}



h1 {font-size: 32pt; font-family: arial, helvetica, sans-serif; color: #000000; text-align: center; font-style: oblique; line-height: 32pt; font-weight: 600; margin: 0px 0px 0px 0px; padding: 5px;}

h2 {font-size: 28pt; font-family: arial, helvetica, sans-serif; color: #000000; text-align: center; font-style:  normal; line-height: 28pt}

h3 {font-size: 24pt; font-family: arial, helvetica, sans-serif; color: #111111; text-align: center; font-style:  normal; line-height: 24pt; font-weight: 600; margin: 0px 0px 0px 0px; padding: 1px 1px}

h4 {font-size: 20pt; font-family: arial, helvetica, sans-serif; color: #111111; text-align: center; font-style:  normal; line-height: 20pt; font-weight: 600; margin: 0px 0px 0px 0px; padding: 0px 0px}

h5 {font-size: 16pt; font-family: arial, helvetica, sans-serif; color: #222222; text-align:   left; font-style:  normal; line-height: 16pt; font-weight: 600; margin: 3px 0px 3px 0px; padding: 0px 0px}

h6 {font-size: 12pt; font-family: arial, helvetica, sans-serif; color: #222222; text-align:   left; font-style:  normal; line-height: 14pt; font-weight: 600; margin: 1px 0px 0px 0px}

p  {font-size: 12pt; font-family: arial, helvetica, sans-serif;	color: #333333;	text-align:   left; font-style:  normal; line-height: 13pt; font-weight: 200; margin: 1px 0px 1px 0px; text-indent: 0px;	}

/* margin: top left bottom right */



.indent {text-indent: 10px}

.center {text-align: center}

.texthighlight1  {color: #fe0000; font-style: italic; font-weight: 600;}

.texthighlight2  {color: #ffffff; font-style: italic; font-weight: 400;}

.texthighlight2a {color: #d0d0ff; font-style: italic; font-weight: 600;} 

.texthighlight2b {color: #00ff00; font-style: normal; font-weight: 600;}

.texthighlight3  {                font-style: italic; font-weight: 600;}

.texthighlight4  {                font-style: normal; font-weight: 600;}



li {font-size: 12pt; font-family: arial; list-style-type: circle; line-height: 16pt; padding: 5px; color: #000000; text-align: left;}



.menu ul {list-style-type: none; margin: 0; padding: 0; }

.menu li {padding: 5px; margin-bottom: 7px; background-color :#005599; color: #ffffff; font-variant: small-caps; font-weight: 800; box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); }
/* .menu li a {display: block; color: #fffff; padding: ; text-decoration: none;} */

.menu li:hover {background-color: #ffffff; color: #005599; font-weight: 800;}
/* .menu li a:hover {background-color: #555; color: white;} */

.menu li:active {background-color: #ffffff; color: #005599; }



.side {background-color: #e0e0e0; padding: 15px; color: #ffffff; text-align: center; font-size: 14px; box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);}

.panel1 {background-color: #e5e5e5; padding: 15px; color: #000000; text-align: left; font-size: 14px; box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);}

.panel2 {background-color: #ffffff; padding: 15px; color: #000000; text-align: left; font-size: 14px; box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);}

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



a:link    {font-family: Arial, Helvetica, sans-serif, ; color: ; text-decoration: none;} 

a:visited {font-family: ; color: ; text-decoration: none; }

a:hover   {font-family: ; color: #003090; text-decoration: underline; font-style: italic ; font-weight: 600; } 

a:active  {font-family: ; color: ; text-decoration: none; } 



input[type=text], select {width: 80%; padding: 12px 20px; margin: 8px 0; display: inline-block; border: 1px solid #ccc; border-radius: 4px; box-sizing: border-box;}

textarea {width: 80%; height: 150px; padding: 12px 20px; box-sizing: border-box; border: 2px solid #ccc; border-radius: 4px; background-color: #f8f8f8; resize: none;}

button[type=submit] {width: 50%; background-color: #007000; color: white; padding: 14px 20px; margin: 8px 0; border: none; border-radius: 4px; cursor: pointer;}

button[type=submit]:hover {background-color: #00c000;}

button[type=reset] {width: 20%; background-color: #908000; color: white; padding: 14px 20px; margin: 8px 0; border: none; border-radius: 4px; cursor: pointer;}

button[type=reset]:hover {background-color: #A0A000;}



/* For mobile phones: */
[class*="col-"] {
    width: 100%;
}
@media only screen and (min-width: 600px) {
    /* For tablets: */
    .col-m-1 {width: 8.33%;}
    .col-m-2 {width: 16.66%;}
    .col-m-3 {width: 25%;}
    .col-m-4 {width: 33.33%;}
    .col-m-5 {width: 41.66%;}
    .col-m-6 {width: 50%;}
    .col-m-7 {width: 58.33%;}
    .col-m-8 {width: 66.66%;}
    .col-m-9 {width: 75%;}
    .col-m-10 {width: 83.33%;}
    .col-m-11 {width: 91.66%;}
    .col-m-12 {width: 100%;}
}
@media only screen and (min-width: 768px) {
    /* For desktop: */
    .col-1 {width: 8.33%;}
    .col-2 {width: 16.66%;}
    .col-3 {width: 25%;}
    .col-4 {width: 33.33%;}
    .col-5 {width: 41.66%;}
    .col-6 {width: 50%;}
    .col-7 {width: 58.33%;}
    .col-8 {width: 66.66%;}
    .col-9 {width: 75%;}
    .col-10 {width: 83.33%;}
    .col-11 {width: 91.66%;}
    .col-12 {width: 100%;}
}


div.img {
    margin: auto;
    border: 1px solid #c0c0c0;
    text-align: center;
	width: 320px;
}	

div.img:hover {
    border: 1px solid #505050;
}

div.img img {
    width: 100%;
    height: auto;
	float: center;
}

div.desc {
    padding: 15px;
    text-align: center;
	font-family: arial, helvetica, sans-serif;	
}


table {border: 0; align: center; cell-pad: 0;}

.producttable {background: #ccdfff; width: 100%; border: 1px ridge #333333; font-size: 9pt; font-family: arial; color: #111111;}


.fitguidetable {background: #f0f0f0; width: 100%; outline: 1px ridge #111111; font-size: 9pt; font-family: arial; color: #333333; vertical-align: text-top; border-collapse: collapse;}

.fitguidetable td {border: solid 1px #e0e0e0;}	

.fitguideheader {background: #60b0ff; font-size: 10pt; font-family: arial; color: #111155; text-align: center; font-weight: 600;}


.pricetable {background: #f0f0f0; width: 100%; outline: 2px solid #000000; padding 1em 1em 1em 1em; font-size: 9pt; font-family: arial; color: #555577; font-weight: 100; border-collapse: collapse;}

.pricetable td {border: solid 1px #e0e0e0;}

.pricetableheader {background: #60b0ff; font-size: 10pt; font-family: arial; color: #111155; text-align: center; font-weight: 600;}

.pricetablefooter {background: #80d0ff; font-size: 10pt; font-family: arial; color: #111155; text-align: center; font-weight: 400;}

.priceheading {background: #e0e0e0; font-size: 9pt; font-family: arial; color:#2222aa; text-align: center; font-weight:500;}

.pricecolumn {font-size: 9pt; font-family: arial; color:#555599; text-align: right;}