@charset "utf-8";
/* CSS Document */

/* Colors
 *   Bright Blue: #008AC9;
**/

body {
  margin: 0;
  padding: 0;
  background-color: #e8e8e8;
}

select {
  background: #FFFFFF;
}

select option:hover {
  background: #007CC2 -webkit-linear-gradient(bottom, #007CC2 0%, #007CC2 100%);
  color: #FFFFFF;
}

select option:checked {
  background: #007CC2 -webkit-linear-gradient(bottom, #007CC2 0%, #007CC2 100%);
}

/* Main body tags */
.wrap {
  background-color: #FFF;
  width: 900px !important;
  min-height: 500px;
  margin: 0 auto 50px auto;
  overflow: hidden;
  font-size: 0.750rem;
  font-family: Verdana, Arial, Tahoma;
  border: 1px solid #BBB;
}

.wrapWider {
  background-color: #FFF;
  width: 1090px !important;
  min-height: 500px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 50px;
  overflow: hidden;
  font-size: 0.750rem;
  font-family: Verdana, Arial, Tahoma;
}

.header {
  display: block;
  width: 100%;
  height: auto;
  float: left;
  position: relative;
  color: #000000;
  background-color: #FFFFFF;
/*background-color: aqua;*/
}

.headLogin {
  background-color: #FFF;
  width: 800px;
  height: 120px;
  float: left;
  border-bottom: 2px solid #000;
  box-shadow: 15px 15px 10px -6px #333, -15px 15px 10px -6px #333;
}

.content {
  background-color: #FFF;
  width: 880px;
  min-height: 500px;
  float: left;
/*font-family: Verdana, Arial, Tahoma;
  font-size: 0.750rem;
  font-weight: 100;*/
  color: #000;
  text-align: left;
  padding: 0px 20px 20px 0px;
  margin-top: 20px;
  clear: both;
/*overflow: auto; */
}

.contentWider {
  background-color: #FFF;
  width: 1026px;
  min-height: 500px;
  float: left;
  color: #000;
  text-align: left;
  padding: 0px 20px 20px 0px;
  margin-top: 20px;
  clear: both;
}

.headings {
  width: 850px;
  background-color: #007CC2;
  color: #FFFFFF;
  font-family: Verdana, Arial, Tahoma;
  font-size: 0.875rem;
  font-weight: bold;
  text-align: left;
  padding: 8px;
  margin: 0 0 10px 0;
}

h2.headings > a {
  display: inline-block;
  position: relative;
  right: 0.250rem;
  float: right;
}

h2.headings > a,
h2.headings > a:link,
h2.headings > a:visited,
h2.headings > a:active {
  color: #FFFFFF;
  text-decoration: none;
}

h2.headings > a:hover {
  color: #000000;
  text-decoration: none;
}

i.edit-icon {
  display: inline-block;
  position: relative;
  width: 0.875rem;
  height: 0.875rem;
  border: 2px solid;
  border-radius: 2px;
  line-height: 1.5;
}

i.edit-icon:before {
  content: '\270e';
  display: inline-block;
  position: absolute;
  bottom: -0.250rem;
  left: 0.188rem;
  font-size: 1.375rem;
  font-weight: normal;
  transform: rotateZ(90deg);
}

.headingBold{
  color: #000;
  font-family: Verdana, Arial, Tahoma;
  font-size: 0.750rem;
  font-weight: bold;
  text-align: left;
  padding-right: 5px;
  float: left;
}

.topContent {
   background-color: #FFF;
   width: 870px;
/* float: left; */
   height: auto;
   margin: inherit;
}

.bottomContent {
   background-color: #FFF;
   width: 870px;
/* float: left; */
   height: auto;
   padding: 15px;
/* margin-top: 23px;
   text-indent: 15px;   */
}

.innerContent {
   background-color: #FFF;
   width: 870px;
   float: left;
   height: auto;
/* padding: 15px;
   margin-top: 23px;
   text-indent: 15px;   */
}

.widerContent {
   background-color: #FFF;
   width: 1025px;
   float: left;
   height: auto;
   padding: 15px;
}

.leftContent {
   background-color: #FFF;
   width: 390px;
   float: left;
   height: auto;
   padding-left: 10px;
/* margin-top: 23px;   */
}

.rightContent {
   background-color: #FFF;
   width: 425px;
   height: auto;
   color: #000;
   float: right;
   padding: 5px;
}

.fullContent{
   background-color: #FFF;
   width: 1000px;
   float: left;
/* font-family: Verdana, Arial, Tahoma;   */
   font-size: 0.750rem;
   font-weight: 100;
   color: #000;
   text-align: left;
   padding: 0px 20px 0px 20px;
   margin-top: 20px;
   clear: both;
/* overflow: auto; */
}

.footer {
   background-color: #FFF;
   width: 880px;
   height: 30px;
   margin-left: auto;
   margin-right: auto;
   padding: 10px;
   border-top: solid 2px #BBB;
   text-align: left;
   color: #000;
   font-size: 0.688rem;
   font-weight: 100;
   font-family: Verdana, Arial, Tahoma;
   clear: both;
}

.leftText {
   width: 600px;
   float: left;
   text-align: left;
}

/* End main body tags */


/* Navigation bar tags */

.menuBar {
  display: block;
  width: 100%;
  height: auto;
  min-height: 37px;
  float: left;
  clear: both;
  border: 1px solid #BBB;
  border-left: 0;
  border-right: 0;
  background: #F1F1F1;
  background-image: linear-gradient(to bottom, #FFFFFF, #F8F8F8, #F1F1F1, #EBEBEB, #E4E4E4);
}

.menuBarShort {
   background-color: #FFF;
   width: 225px;
   height: 22px;
   float: right;
}

.navBtn {
   width: 150px;
   height: 30px;
   float: left;
/* box-shadow: 0px 0px 10px 2px #000 inset ;
   -moz-box-shadow: 0px 0px 10px 2px #409bdf inset ;
   -webkit-box-shadow: 0px 0px 10px 0px #409bdf inset ; */
   background-color: #000;
   color: #409bdf;
   font-family: Verdana, Arial, Tahoma;
   font-size: 1.250rem;
   font-weight: bold;
   text-align: center;
   vertical-align: middle;
   padding-top: 5px;
}

.navQuick {
   width: 300px;
   height: 30px;
   float: left;
/* box-shadow: 0px 0px 10px 2px #000 inset ;
   -moz-box-shadow: 0px 0px 10px 2px #000 inset ;
   -webkit-box-shadow: 0px 0px 10px 0px #000 inset ; */
   background-color: #409bdf;
   color: #000;
   font-family: Verdana, Arial, Tahoma;
   font-size: 1.250rem;
   font-weight: bold;
   text-align: center;
   vertical-align: middle;
   padding-top: 5px;
}

#titleNav {
   width: 200px;
   height: 35px;
   margin-left: auto;
   margin-right: auto;
   font-family: Verdana, Arial, Tahoma;
   font-size: 0.750rem;
   font-weight: bold;
   text-align: center;
   display: table-cell;
   -moz-user-select:none;
   vertical-align: middle;
/* box-shadow: 0px 0px 10px 2px #d71920 inset ;
   -moz-box-shadow: 0px 0px 10px 2px #d71920 inset ;
   -webkit-box-shadow: 0px 0px 10px 0px #d71920 inset ; */
   background-color: #FFF;
   color: #d71920;
/* border-top-right-radius: 1em;
   border-top-left-radius: 1em;
   -moz-border-radius-topright: 1em;
   -moz-border-radius-topleft: 1em;
   -webkit-border-top-right-radius: 1em;
   -webkit-border-top-left-radius: 1em;
   border-bottom: solid 2px #000; */
}

/* End navigation bar tags */


/* Special header tags */

.progress {
   width: 100px;
   float: right;
/* padding-left: 300px;   */
}

.headText {
   width: auto;
   float: left;
   margin: 10px 0 0 10px;
   text-align: left;
   font-size: 0.750rem;
   color: #d71920;
   background-color: #FFF;
}

.headLeft {
  display: block;
  width: auto;
  height: auto;
  float: left;
  padding: 10px 0 10px 5px;
/*background-color: fuchsia;*/
}

.headRight {
  display: block;
  width: auto;
  height: auto;
  float: right;
  text-align: right;
  white-space: nowrap;
  font-size: 0.688rem;
  padding: 0 5px 0 0;
  margin: 50px 0 5px 0;
/*background-color: beige;*/
}

.headRight a  { text-decoration: none }
.headRight a:link    { color: #000000 }
.headRight a:visited { color: #000000 }
.headRight a:active  { color: #000000 }
.headRight a:hover   {
  color: #004890;
  text-decoration: none;
}

.headBottom {
   background-color: #FFFFFF;
   width: 800px;
   float: left;
   padding-left: 10px;
   font-weight: 100;
   font-size: 0.688rem;
}

.headTop {
   background-color: #FFF;
   width: 880px;
   float: left;
   padding: 10px;
}

.barcode {
   width: auto;
   float: right;
   padding-right: 10px;
   text-align: right;
}

.dealerRole {
   background-color: #DDD;
   width: 100%;
   float: right;
   padding: 3px 0px 2px 0px;
}

/* End special header tags */

/* Line spacer tags */

.verticalSpacer {
   width: 2px;
   height: 350px;
   background-color: #d71920;
   float: left;
   margin: 9px;
   margin-top: 20px;
}

.horizontalSpacer {
   width: 860px;
   height: 2px;
   background-color: #d71920;
   float: left;
}

.titleSolid {
   width: 850px;
   float: left;
   background-color: #d71920;
   background-image: url(images/bkgd.png);
   background-repeat: repeat-x;
   color: #FFF;
   font-family: Verdana, Arial, Tahoma;
   font-size: 0.750rem;
   padding-left: 5px;
   border: solid 1px #000;
}

/* End line spacer tags */


/* Link tags */

a  { text-decoration: none }
a:link    { color: #000000 }
a:visited { color: #000000 }
a:active  { color: #000000 }
a:hover   {
  color: #004890;
  text-decoration: underline;
}

a[href^="mailto:"]  { text-decoration: none }
a[href^="mailto:"]:link    { color: #000000 }
a[href^="mailto:"]:visited { color: #000000 }
a[href^="mailto:"]:active  { color: #000000 }
a[href^="mailto:"]:hover   {
  color: #004890;
  text-decoration: none;
}

/* End link tags */


/* Drop Down Menu tags */
#nav {
  list-style: none;
  display: block;
  margin: 0;
  padding: 0;
  font-family: Verdana, Arial, Tahoma;
  font-size: 0.875rem;
  font-weight: bold;
  z-index: 5;
/*background-color: fuchsia;*/
}

#nav li {
  display: inline-block;
  margin: 0;
  padding: 0;
  float: left;
  position: relative;
/*background: beige; */
}

#nav a {
  display: inline-block;
  margin: 0;
  padding: 10px 20px;
  color: #006AAA;
  text-decoration: none;
  border-right: 1px solid #BBB;
}

#nav a:hover {
  color: #D10000;
  text-decoration: underline;
}

/*--- DROPDOWN ---*/
#nav ul{
/* background:#f00; /* Adding a background makes the dropdown work properly in IE7+. Make this as close to your page's background as possible (i.e. white page == white background). */
   background:rgba(255,255,255,0); /* But! Let's make the background fully transparent where we can, we don't actually want to see it if we can help it... */
   list-style:none;
   position:absolute;
   left:-9999px; /* Hide off-screen when not needed (this is more accessible than display:none;) */
}
#nav ul li{
   padding-top: 0px; /* Introducing a padding between the li and the a give the illusion spaced items */
   float:none;
   border: solid 2px #000;
   border-left: solid 2px #d71920;
   position: relative;
   left: -42px;
}
#rNav ul li{
   padding-top:0px; /* Introducing a padding between the li and the a give the illusion spaced items */
   float:none;
   border: solid 2px #000;
   border-right: solid 2px #d71920;
   position: relative;
   left: -168px;
   text-align: right;
}

#crNav ul li{
   padding-top:0px; /* Introducing a padding between the li and the a give the illusion spaced items */
   float:none;
   border: solid 2px #000;
   border-right: solid 2px #d71920;
   position: relative;
   left: -64px;
   text-align: right;
}
#nav ul a{
   white-space:nowrap; /* Stop text wrapping and creating multi-line dropdown items */
}
#nav li:hover ul{ /* Display the dropdown on hover */
   left:0; /* Bring back on-screen when needed */
   top: 21px;
}

#nav li:hover a { /* These create persistent hover states, meaning the top-most link stays 'hovered' even when your cursor has moved down the list. */
  color: #D10000;
  text-decoration: none;
  background: #F1F1F1;
  background-image: linear-gradient(to top, #FFFFFF, #F8F8F8, #F1F1F1, #EBEBEB, #E4E4E4);
}

#nav li:hover ul a{ /* The persistent hover state does however create a global style for links even before they're hovered. Here we undo these effects. */
   text-decoration:none;
}
#nav li:hover ul li a:hover{ /* Here we define the most explicit hover states--what happens when you hover each individual link. */
   background:#333;
   color: #FFF;
}
/* End drop down menu tags */


/* Javascript header animation */

.rightAnimation {
   width: 300px;
   float:right;
   text-align: right;
   padding-right: 10px;
   margin: 5px 20px 0 10px;
}

.firstImg {
   width: 400px;
   float: left;
   display: none;
   position: absolute;
   left: 0px;
   top: 0px;
}

.secondImg {
   width: 278px;
   float: left;
   display: none;
   position: absolute;
   left: 10px;
   top: 10px;
   z-index: 10;
}

.thirdImg {
   width: 278px;
   float: left;
   display: none;
   position: absolute;
   left: 135px;
   top: 10px;
   z-index: 10;
}

/* End javascript header animation */

/* Special table tags */

table {
   background-color: #FFF;
   width: 99%;
   border-collapse: collapse;
   padding: 2px 5px 2px 5px;
   font-size: 0.750rem;
   font-family: Verdana, Arial, Tahoma;
}

th {
   background-color: #007CC2;
   color: #FFF;
   font-size: 0.750rem;
   font-weight: normal;
   text-align: left;
   padding: 4px;
}

#thRight {
   background-color: #7cc144;
   color: #FFF;
   font-weight: bold;
   text-align: right;
   padding-right: 5px;
}

#tdRight {
   word-wrap:break-word;
   padding-right: 5px;
   text-align: right;
}

table td {
   word-wrap:break-word;
   padding-left: 5px;
   text-align: left;
}

/* End special table tags */

/* Basic table overrides */

.removeTableStyle table/*, td, th*/ {
   border-collapse: collapse;
   border: none;
   padding: 2px;
}

.removeTableStyle table {
   width: 100%;
   font-family: Verdana, Arial, Tahoma;
   font-size: 0.813rem;
   font-weight: 100;
   color: #000;
   background-color: #DDD;
}

.removeTableStyle th {
   background-color: #d71920;
   background-image: url(images/bkgd.png);
   background-repeat: repeat-x;
   color: #FFF;
   padding-left: 5px;
   font-family: Verdana, Arial, Tahoma;
   font-size: 0.750rem;
   font-weight: 100;
   text-align: left;
}

.removeTableStyle tr:hover {
   background-color: #DDD;
}

.removeTableStyle td {
   background-color: #DDD;
   border: none;
}

/* End basic table overrides */

/* Special button tags */

.btnRight {
   padding: 5px;
   width: 100%;
   width: calc(100% - 10px);
   text-align: right;
}
#abtnnext, #abtnback {
/* in case of any adjustments to the buttons themselves */
}

/* End special button tags */

/* Textbox and form tags */

form {
/* font-weight: bold;   */
}

.inputNarrow {
   width: 500px;
}

input[type=text] {
   border: 1px solid #004890;
}

input[type=password] {
   border: 1px solid #004890;
}

textarea {
   border: 1px solid #004890;
}

select {
   border: 1px solid #004890;
}

/* End textbox and form tags */

/* Boxes with folded edge tags */

.boxes {
   width: 500px;
   height: auto;
   float: left;
   margin: 0 10px 0 10px;
   box-shadow: 10px 10px 10px -6px #333;
}

.loginBoxes {
   width: 375px;
   height: auto;
   float: left;
   margin: 0 20px 0 20px;
   box-shadow: 10px 10px 10px -6px #333;
}

.widerBoxes {
   width: 850px;
   height: auto;
/* float: left; */
   margin: 0 auto;
   box-shadow: 10px 10px 10px -6px #333;
}

.boxHeading {
   background-color: #FFF;
   background-image: url(images/heading.png);
   background-repeat: repeat-x;
   height: 20px;
   color: #555;
   font-weight: bold;
   font-size: 0.750rem;
   font-weight: bold;
   padding: 6px 0 0px 20px;
   border-right: 1px solid #BBB;
   margin: 0;
}

.boxInside {
   background-color: #FFF;
   color: #000;
   font-size: 0.750rem;
   font-weight: 100;
   padding: 5px;
   border: 1px solid #BBB;
}

.triangle {
   width: 15px;
   height: 26px;
   background-image: url(images/triangle.png);
/* background-repeat: repeat-x;
   border-bottom: 26px solid #DDD;
   border-left: 15px solid #FFF;   */
   float: left;
}

.spaceBox {
   height: 675px;
}

/* End boxes with folded edge tags */

/* Special tags */

.hilite {
   background-color: #d78e90;
   padding: 2px;
   font-weight: bold;
}

#xmlFAQ {
   width: 100%;
   height: 100%;
   margin: 20px;
   background-color: #30C;
   font-family: Verdana, Arial, Tahoma;
   font-weight: 100;
   font-size: 0.750rem;
   color: #FFF;
}

.messages {
   width: 95%;
   margin: 10px 20px 10px 20px;
   padding: 10px;
   font-family: Verdana, Arial, Tahoma;
   font-weight: bold;
   font-size: 0.750rem;
   color: #d71920;
   text-align: left;
   background-color: #DDD;
}

a img {
   outline : none;
}

img {
   border : 0;
}

.adBtn {
   margin-left: 5px;
   float: left;
   vertical-align: text-bottom;
}

.cancelBtn {
   background: #d71920;
   color: white;
}

.BUTTONAPPRDENYLINKBUTTON {
   font-family: Verdana, Arial, Tahoma;
   width:25;
   text-align:center;
   border-style:solid;
   border-width:2;
   border-color: #c00 #c00;
   background-color:white;
   color:red;
   text-decoration:none;
}

#listSpace {
   display: block;
}

.menuList {
   color: #008AC9;
   font-size: 0.938rem;
   font-weight: 100;
   padding: 5px;
   list-style:url(images/clogo.gif);
}

.menuList a {
   color: #004890;
}

.menuList a:hover {
   color: #008AC9;
}

/* -------------------------------------------------------------------------- */

p.outline {
  border: 2px solid #F00;
  padding: 10px;
  font-size: 0.875rem;
  box-shadow: 4px 4px 4px;
}

p.outline span.attention {
  color: #F00;
  font-size: 1.375rem;
  font-weight: bold;
  padding-left: 32px;
  background: url(images/circleExclaim.png);
  background-repeat: no-repeat;
  background-size: 26px;
  background-position-y: 1px;
}

p.outline span.attentionText {
  font-size: 1rem;
  font-weight: bold;
}

p.outline span.alert {
}

/* -------------------------------------------------------------------------- */

#skipNavigation a {
  padding: 6px;
  position: absolute;
  top: -40px;
  left: 0px;
  color: white;
  border: 1px solid #BF1722;
  border-bottom-right-radius:8px;
  background: #BF1722;
  -webkit-transition: top 1s ease-out;
  transition: top 1s ease-out;
  z-index: 100;
}

#skipNavigation a:before {
  content: 'Skip Navigation';
}

#skipNavigation a:focus {
  position: absolute;
  left: 0px;
  top: 0px;
  outline-color: transparent;
  -webkit-transition: top .1s ease-in;
  transition: top .1s ease-in;
}

/* -------------------------------------------------------------------------- */
/* Some Bootstrap 5.0 custom button styles from:                              */
/* https://getbootstrap.com/docs/5.0/components/buttons/                      */
/* -------------------------------------------------------------------------- */

button {
  text-transform: none;
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  border-radius: 0;
  box-sizing: border-box;
}

button:focus:not(:focus-visible) {
  outline: 0;
}

[type=button], [type=reset], [type=submit], button {
  -webkit-appearance: button;
  appearance: button;
}

[type=button]:not(:disabled), [type=reset]:not(:disabled), [type=submit]:not(:disabled), button:not(:disabled) {
  cursor: pointer;
}

.btn {
  display: inline-block;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  background-color: transparent;
  border: 1px solid transparent;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  border-radius: 0.25rem;
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

.btn-check:focus+.btn, .btn:focus {
  outline: 0;
  box-shadow: 0 0 0 0.25rem rgb(13 110 253 / 25%);
}

.btn-primary {
  color: #fff;
  background-color: #0d6efd;
  border-color: #0d6efd;
}

.btn-primary:hover {
  color: #fff;
  background-color: #0b5ed7;
  border-color: #0a58ca;
}

.btn-check:focus+.btn-primary, .btn-primary:focus {
  color: #fff;
  background-color: #0b5ed7;
  border-color: #0a58ca;
  box-shadow: 0 0 0 0.25rem rgb(49 132 253 / 50%);
}

.btn-check:active+.btn-primary:focus, .btn-check:checked+.btn-primary:focus, .btn-primary.active:focus, .btn-primary:active:focus, .show>.btn-primary.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.25rem rgb(49 132 253 / 50%);
}

.btn-group-sm>.btn, .btn-sm {
  padding: 0.25rem 0.5rem;
  font-size: 0.875rem;
  border-radius: 0.2rem;
}

.btn-group-lg>.btn, .btn-lg {
  padding: 0.5rem 1rem;
  font-size: 1.250rem;
  border-radius: 0.3rem;
}

/* -------------------------------------------------------------------------- */

.btn-primary {
  color: #FFFFFF;
  background: #0C479D;
  border-color: #0C479D;
  min-width: 80px;
}

.btn-primary:hover {
  color: #FFFFFF;
  background: #007CC2;
  border-color: #007CC2;
}

/* -------------------------------------------------------------------------- */

.Hidden {
  display: none;
}

.alert {
  position: relative;
  font-size: 1rem;
  padding: .75rem 1.25rem;
  margin-bottom: 1rem;
  border: 1px solid transparent;
  border-radius: .25rem;
}

.alert > b {
  font-weight: bold;
}

.alert > span {
  font-weight: normal;
}

.alert > span > sup {
  font-size: .5em;
}

.alert-danger {
  color: #721c24;
  background-color: #f8d7da;
  border-color: #f5c6cb;
}

.alert-dismissible {
  padding-right: 4rem;
}

.alert-dismissible .close {
  position: absolute;
  top: 0;
  right: 0;
  padding: .75rem 1.25rem;
  color: inherit;
}

.close {
  float: right;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1rem;
  color: #000;
  text-shadow: 0 1px 0 #fff;
  opacity: .5;
}

.close:focus, .close:hover {
  color: #000;
  text-decoration: none;
  opacity: .75;
}

.close:not(:disabled):not(.disabled) {
  cursor: pointer;
}

button.close {
  padding: 0;
  background-color: transparent;
  border: 0;
  -webkit-appearance: none;
  appearance: none;
}

/* -------------------------------------------------------------------------- */

.pseudoTable {
  display: table;
  table-layout: auto;
}

.pseudoTable > .body {
  display: table-row-group;
}

.pseudoTable > .row,
.pseudoTable > .body > .row {
  display: table-row;
}

.pseudoTable > .row > .cell,
.pseudoTable > .body > .row > .cell {
  display: table-cell;
  text-align: left;
  vertical-align: middle;
  padding: 0 .5ch 0.125rem 0;
}

.pseudoTable > .row > .cell:last-child,
.pseudoTable > .body > .row > .cell:last-child {
  padding-right: 0;
}

/* -------------------------------------------------------------------------- */

.rebateSteps {
  width: auto;
}

.rebateSteps .cell {
  margin: 0;
  padding: 3px;
  text-align: center;
  vertical-align: middle;
}

.btn-step {
  display: inline-block;
  width: 1.5rem;
  height: 1.5rem;
  line-height: 1.5rem;
  border: 3px solid #F5F5F5;
  border-radius: 50%;
  color: #FFFFFF;
  text-align: center;
  text-decoration: none;
  background: #555777;
  box-shadow: 0px 0px 2px #333;
  font-size: 0.875rem;
  font-weight: bold;
}

.btn-step,
.btn-step.off,
.btn-step.off:hover {
  background: #0C479D;
}

a > .btn-step:hover {
  background: #007CC2;
}

.btn-step-dash {
  width: .5rem;
  border-bottom: 2px #999999 solid;
  box-shadow: 1px 1px 1px #C0C0C0;
}

.btn-step.off,
.btn-step-dash.off {
  opacity: .5;
}

.rebateSteps > .row:last-child > .cell,
.rebateSteps > .body > .row:last-child > .cell {
  text-align: center;
}

/* -------------------------------------------------------------------------- */

.submitYourRebateOnline {
  width: 100%;
}

.submitYourRebateOnline > .body > .row > .cell {
  padding: 0.125rem .5ch !important;
}

.submitYourRebateOnline > .body > .row > .cell:last-child {
  width: 0;
  padding: 0.5rem 1ch 0.25rem .5ch !important;
}

/* -------------------------------------------------------------------------- */

.barcode {
  width: auto;
  float: none;
  margin: 0;
  padding: 0 5px 0 0;
}

.barcode > .row > .cell,
.barcode > .body > .row > .cell {
  margin: 0;
  padding: 0 10px 0 0;
}

.barcode img {
  display: block;
  width: 30px;
  height: 30px;
  border: 0;
  margin: 0;
  padding: 0;
}

/* -------------------------------------------------------------------------- */

.purchaseInformation {
  width: 100%;
  width: calc(100% - 12px);
  margin: 0 0 0 8px;
  padding: 0;
}

.purchaseInformation > .body > .row > .cell {
  width: 16%;
  text-align: left;
  vertical-align: top;
}

.purchaseInformation > .body > .row > .cell.rowspan-2:last-child {
  text-align: right;
  vertical-align: middle;
  padding-right: 7px;
}

.purchaseInformation > .body > .row > .cell > label {
  display: block;
  white-space: nowrap;
  font-weight: bold;
}

.purchaseInformation > .body > .row > .cell > label > span {
  text-transform: capitalize;
}

.purchaseInformation > .body > .row > .cell > div {
  display: block;
  position: relative;
  white-space: nowrap;
}

.purchaseInformation > .body > .row > .cell > div:nth-child(3) {
  width: auto;
  text-align: left;
  margin: auto;
  white-space: normal;
  font-size: 0.625rem;
}

.purchaseInformation > .body > .row > .cell > div:nth-child(3) > a {
  text-decoration: underline;
}

.purchaseInformation > .body > .row > .cell > div > span {
  position: absolute;
  top: .25rem;
  left: -1.1ch;
}

/* -------------------------------------------------------------------------- */

.contactInformation {
  width: 100%;
  width: calc(100% - 12px);
  margin: 0 0 0 8px;
  padding: 0;
}

.contactInformation .pseudoTable {
  width: 100%;
}

.contactInformation input,
.contactInformation select {
  margin-bottom: 5px;
}

.contactInformation label {
  display: block;
  white-space: nowrap;
  font-weight: bold;
}

.pseudoTable.contactInformation > .body > .row > .cell {
  vertical-align: top;
}

.contactInformation > .body > .row > .cell > div {
  display: block;
  position: relative;
  white-space: nowrap;
}

.contactInformation > .body > .row > .cell > div:nth-child(3) {
  width: auto;
  text-align: left;
  margin: auto;
  white-space: normal;
}

.contactInformation > .body > .row > .cell > div > span {
  position: absolute;
  top: .25rem;
  left: -1.1ch;
}

/* -------------------------------------------------------------------------- */

.visually-hidden {
  display: block;
  width: 1px;
  height: 1px;
  border: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  position: absolute!important;
  left: 100vw;
  clip: rect(1px  1px  1px  1px);
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(50%);
}

/* -------------------------------------------------------------------------- */

.boxInside {
  width: 100%;
  width: calc(100% - 13px);
  max-width: 854px;
}

.triangle ~ .boxHeading ~ .boxInside {
  border-top: 0;
  width: 100%;
  width: calc(100% - 12px);
  max-width: none;
}

/* -------------------------------------------------------------------------- */

.menuBar {
  position: relative;
}

.menuBar > div {
  font-size: 0.625rem;
  font-weight: 100;
  display: inline-block;
  position: absolute;
  top: 5px;
  right: 10px;
}

.menuBar > label {
  display: none;
}

.menuBar > ul ~ div {
  display: flex;
  align-items: center;
  float: right;
  clear: right;
  position: relative;
  top: auto;
  right: auto;
  font-size: 0.688rem;
  font-weight: 100;
  padding: 0 5px 0 0;
  min-height: 37px;
  max-height: 41px;
  max-width: 35ch;
/*background: azure;*/
}

@media print {
  .menuBar > input,
  .menuBar > span {
    display: none;
  }
}

@media screen and (min-width: 931px) {
  .menuBar > input,
  .menuBar > span {
    display: none;
  }
}

@media screen and (max-width: 930px) {
  .menuBar > div {
    z-index: -1;
  }
}

/* -------------------------------------------------------------------------- */

.footer div:first-child {
  float: left;
  clear: left;
}

.footer div:last-child {
  float: right;
  clear: right;
}

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

  .g-recaptcha {
    width: 302px;
    overflow: hidden;
/*  background: fuchsia;*/
  }

}

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

  .headRight {
    width: 100%;
    margin: 0 0 5px 0;
  }

}

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

  body {
    width: 100%;
    margin: 0;
    padding: 0;
    background: none;
    background-color: #FFFFFF;
  }

  .wrap {
    width: 100%!important;
    border: none;
    margin: 0;
    padding: 0;
    border: none;
    overflow: visible;
  }

  .headTop {
    width: 100%;
    width: calc(100% - 20px);
    float: none;
  }

  .header {
    width: 100%;
    height: auto;
    margin: 0 0 1rem 0;
    padding: 0;
  }

  .menuBar {
    display: block;
    width: 100%;
    position: relative;
    z-index: 1;
    -webkit-user-select: none;
    user-select: none;
  }

  .menuBar > div {
    -webkit-user-select: text;
    user-select: text;
  }

  .menuBar > input {
    display: block;
    width: 40px;
    height: 29px;
    position: absolute;
    top: 1px;
    left: 0px;
    cursor: pointer;
    opacity: 0;
    z-index: 2;
    -webkit-touch-callout: none;
  }

  .menuBar > input:focus-visible {
    -webkit-appearance: none;
    appearance: none;
    background: transparent;
    opacity: 1;
    border: none;
  }

  .menuBar > input ~ span {
    display: block;
    width: 33px;
    height: 4px;
    position: relative;
    margin: 0 0 5px 14px;
    background: #006AAA;
    border-radius: 3px;
    z-index: 1;
    transform-origin: 4px 0px;
    transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
                background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
                opacity 0.55s ease;
  }

  .menuBar > input:hover ~ span {
    background: #D10000;
  }

  .menuBar > input ~ span:nth-child(3) {
    margin-top: 8px;
  }

  .menuBar > input ~ span:nth-child(4) {
    transform-origin: 0% 0%;
  }

  .menuBar > input ~ span:nth-child(5) {
    transform-origin: 0% 100%;
  }

  .menuBar > input:checked ~ span {
    opacity: 1;
    transform: rotate(45deg) translate(-2px, -1px);
/*  background: #232323;*/
  }

  .menuBar > input:checked ~ span:nth-child(4) {
    opacity: 0;
    transform: rotate(0deg) scale(0.2, 0.2);
  }

  .menuBar > input:checked ~ span:nth-child(5) {
    transform: rotate(-45deg) translate(0, -1px);
  }

  .menuBar > ul ~ div {
    position: absolute;
    top: 0;
    right: 0;
    max-width: none;
  }

  .content {
    width: 100%;
    height: auto;
    margin: 0 0 1.5rem 0;
    padding: 0;
  }

  .topContent {
    width: 100%;
    margin-bottom: 10px;
  }

  .topContent img {
    width: 100%;
    height: auto;
  }

  .bottomContent {
    float: none;
    width: 100%;
    width: calc(100% - 3px);
    height: auto;
    margin: 0 1px 1rem 2px;
    padding: 0;
  }

  .bottomContent > p {
    margin: 0 0 1rem 0;
    padding: 0 10px;
/*  text-align: justify; */
  }

  .boxInside {
    margin-bottom: 10px;
    max-width: none;
  }

  .widerBoxes {
    width: 100%;
    box-shadow: none;
  }

  .loginBoxes {
    margin: 0 3%;
    width: 94%;
    max-width: 375px;
  }

  .headings {
    width: 100%;
    width: calc(100% - 17px);
  }

  .footer {
    width: 100%;
    margin: 0 0 20px 0;
    padding: 0;
  }

  .footer div:first-child {
    float: none;
    clear: none;
    margin: 10px 0 0 10px;
  }

  .footer div:last-child {
    float: none;
    clear: none;
    margin: 2px 0 0 10px;
    padding-bottom: 20px;
  }

  #nav {
    display: inline-block;
    width: auto;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 0;
    left: auto;
    background: #EDEDED;
    border: 0;
    border-right: 1px solid #BBB;
    border-bottom: 1px solid #BBB;
    transform-origin: 0% 0%;
    transform: translate(-100%, 0);
    transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);
    z-index: 0;
    -webkit-font-smoothing: antialiased;
  }

  #nav:focus-within,
  input:checked ~ #nav {
    transform: none;
  }

  #nav li {
    display: block;
    padding: 0;
    margin: 0 2ch 1rem 1ch;
    font-size: 1rem;
    text-transform: capitalize;
    float: none;
  }

  #nav li:first-child {
    padding-top: 40px;
  }

  #nav li:hover a {
    background: none;
  }

  #nav a {
    display: block;
    border: 0;
    background: none;
    margin: 0;
    padding: 0;
  }

  #divAlert {
    width: 100%;
    width: calc(100% - 5.4rem);
    max-width: none;
  }

  table.rebateDetails > tbody > tr > td:nth-child(3) {
    display: none;
  }

  .purchaseInformation,
  .purchaseInformation > .body,
  .purchaseInformation > .body > .row {
    display: block;
    width: 100%;
  }

  .purchaseInformation {
    margin-left: 10px;
    width: calc(100% - 10px);
  }

  .purchaseInformation > .body > .row > .cell {
    display: block;
    width: auto;
    padding: 0;
    margin: 0 0 5px 0;
  }

  .purchaseInformation > .body > .row > .cell > label {
    display: inline-block;
    min-width: 16ch;
  }

  .purchaseInformation > .body > .row > .cell > div {
    display: inline-block;
  }

  .purchaseInformation > .body > .row > .cell.rowspan-2:last-child {
    text-align: left;
  }

  .contactInformation,
  .contactInformation > .body,
  .contactInformation > .body > .row,
  .pseudoTable.contactInformation .pseudoTable,
  .pseudoTable.contactInformation .pseudoTable > .row {
    display: block;
    width: 100%;
  }

  .contactInformation {
    margin-left: 10px;
    width: calc(100% - 10px);
  }

  .contactInformation > .body > .row > .cell,
  .contactInformation .pseudoTable > .row > .cell {
    display: block;
    width: auto;
    padding: 0;
    margin: 0 0 5px 0;
  }

  .contactInformation > .body > .row > .cell > label,
  .contactInformation .pseudoTable > .row > .cell > label {
    display: inline-block;
    min-width: 15ch;
    vertical-align: top;
  }

  .contactInformation > .body > .row > .cell > div,
  .contactInformation .pseudoTable > .row > .cell > div {
    display: inline-block;
  }

}

/* -------------------------------------------------------------------------- */