/* Global Reset */
html,
body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
form,
fieldset,
legend,
input,
textarea,
p,
blockquote,
th,
td {
  margin: 0;
  padding: 0;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
fieldset,
img {
  border: 0;
}
address,
caption,
cite,
code,
dfn,
em,
strong,
th,
var {
  font-style: normal;
  font-weight: normal;
}
li {
  list-style: none;
}
caption,
th {
  text-align: left;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 100%;
  font-weight: normal;
}
q:before,
q:after {
  content: n "";
}
abbr,
acronym {
  border: 0;
  font-variant: normal;
}
sup {
  vertical-align: text-top;
}
sub {
  vertical-align: text-bottom;
}
input,
textarea,
select {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
}
input,
textarea,
select {
  *font-size: 100%;
}
legend {
  color: #000;
}

#privacy {
  width: 600px;
  margin-bottom: 20px;
}
p.policy {
  font-size: 11px;
  color: #666;
  margin-top: 5px;
}

.policy_close {
  margin: 0 auto;
  border: 1px solid #0c5a00;
  padding: 6px 15px;
  width: 100px;
  text-align: center;
  text-decoration: none;
}
.policy_close:hover {
  text-decoration: underline;
  cursor: pointer;
}

/* Layout */
body {
  background: url(images/bg.gif);
  font-size: 12px;
  line-height: 18px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #555;
  text-align: left;
}
.full {
  float: left;
  width: 100%;
}
.auto {
  width: 960px;
  margin: 0 auto;
}
#wrap {
  background: #fff /*url(images/headerbg.gif) 0 0 repeat-x;*/;
}
#content {
  background: #fff;
  padding: 0 0 24px 0;
}
#copy {
  width: 740px;
  float: left;
  padding: 0 20px 0 0;
}
#right {
  width: 180px;
  float: right;
}
.split-left {
  float: left;
  width: 50%;
}
.split-right {
  float: right;
  width: 50%;
}

/* Header */
#masthead {
  background: #fff url(images/header.gif) 0 0 repeat-x;
}
#header {
  height: 217px;
  position: relative;
}
#home #header {
  height: 187px;
}
a#logo {
  position: absolute;
  top: 20px;
  left: 10px;
  display: block;
}
a#ordernow {
  position: absolute;
  top: 55px;
  right: 15px;
  width: 110px;
  height: 110px;
  background: url(images/ordernow.gif) 0 0 no-repeat;
}
a#ordernow:hover {
  background: url(images/ordernow.gif) -110px 0 no-repeat;
}
#search {
  position: absolute;
  top: 5px;
  right: 10px;
}
#search p {
  padding: 0;
}
#search input.submit {
  display: inline;
  float: left;
  width: 29px;
  height: 28px;
  padding: 0;
  border: 0;
}
#search input {
  width: 151px;
  height: 18px;
  border: 0;
  padding: 8px 10px 2px 10px;
  display: inline;
  float: left;
  background: url(images/searchbox.gif) 0 0 no-repeat;
  color: #777;
}
#cse-search-results {
  margin: 0 10px;
}

/* Navigation */
#nav {
  position: absolute;
  top: 129px;
  left: 143px;
}
#nav ul {
  width: 678px;
  height: 50px;
  margin: 0;
}
#nav li a.section {
  height: 50px;
  display: block;
  text-decoration: none;
  background-repeat: no-repeat;
}
#nav li {
  margin: 0;
  padding: 0;
  background: none;
  float: left;
}
#nav li#nav-blog {
  float: right;
}
#nav li#nav-jrbutils_nw a.section {
  width: 255px;
  background-image: url(images/nav-new.png);
  background-position: 0 0;
}
#nav li#nav-jrbutils_ad a.section {
  width: 170px;
  background-image: url(images/nav-new.png);
  background-position: -255px 0;
}
#nav li#nav-order a.section {
  width: 89px;
  background-image: url(images/nav-new.png);
  background-position: -420px 0;
}
#nav li#nav-renew a.section {
  width: 100px;
  background-image: url(images/nav-new.png);
  background-position: -505px 0;
}
#nav li#nav-blog a.section {
  width: 50px;
  background-image: url(images/nav-new.png);
  background-position: -612px 0;
}
#nav li#nav-jrbutils_nw a.section:hover,
#nav li#nav-jrbutils_nw.on a.section,
#nav li#nav-jrbutils_nw.on a.section:hover {
  background-image: url(images/nav-new.png);
  background-position: 0 -50px;
}
#nav li#nav-jrbutils_ad a.section:hover,
#nav li#nav-jrbutils_ad.on a.section,
#nav li#nav-jrbutils_ad.on a.section:hover {
  background-image: url(images/nav-new.png);
  background-position: -255px -50px;
}
#nav li#nav-order a.section:hover,
#nav li#nav-order.on a.section,
#nav li#nav-order.on a.section:hover {
  background-image: url(images/nav-new.png);
  background-position: -420px -50px;
}
#nav li#nav-renew a.section:hover,
#nav li#nav-renew.on a.section,
#nav li#nav-renew.on a.section:hover {
  background-image: url(images/nav-new.png);
  background-position: -505px -50px;
}
#nav li#nav-blog a.section:hover,
#nav li#nav-blog.on a.section,
#nav li#nav-blog.on a.section:hover {
  background-image: url(images/nav-new.png);
  background-position: -612px -50px;
}

/* Sub Navigation */
#nav ul li ul {
  display: none;
  position: absolute;
  top: 50px;
  left: 0;
  width: 569px;
  height: 38px;
}
#nav ul li.on ul {
  display: block;
}
#nav ul li ul a {
  height: 38px;
  display: block;
  text-decoration: none;
  background-repeat: no-repeat;
}
#nav ul li ul li {
  margin-left: 15px;
  display: inline;
}
#nav li ul li.nav-overview a {
  width: 67px;
  background: url(images/subnav.gif) -15px 0;
}
#nav li ul li.nav-utils a {
  width: 53px;
  background: url(images/subnav.gif) -102px 0;
}
#nav li ul li.nav-enhancements a {
  width: 103px;
  background: url(images/subnav.gif) -175px 0;
}
#nav li ul li.nav-notes a {
  width: 99px;
  background: url(images/subnav.gif) -297px 0;
}
#nav li ul li.nav-choosing a {
  width: 138px;
  background: url(images/subnav.gif) -416px 0;
}
#nav li ul li.nav-overview a:hover,
#nav li ul li.nav-overview.active a {
  background: url(images/subnav.gif) -15px -38px;
}
#nav li ul li.nav-utils a:hover,
#nav li ul li.nav-utils.active a:hover,
#nav li ul li.nav-utils.active a {
  background: url(images/subnav.gif) -102px -38px;
}
#nav li ul li.nav-enhancements a:hover,
#nav li ul li.nav-enhancements.active a,
#nav li ul li.nav-enhancements.active a:hover {
  background: url(images/subnav.gif) -175px -38px;
}
#nav li ul li.nav-notes a:hover,
#nav li ul li.nav-notes.active a,
#nav li ul li.nav-notes.active a:hover {
  background: url(images/subnav.gif) -297px -38px;
}
#nav li ul li.nav-choosing a:hover,
#nav li ul li.nav-choosing.active a,
#nav li ul li.nav-choosing.active a:hover {
  background: url(images/subnav.gif) -416px -38px;
}

/* Section Navigation */
ol#sectionnav {
  margin: 30px 0 0 0;
}
ol#sectionnav li.on a {
  color: #000;
  text-decoration: none;
}
ol#sectionnav li {
  padding: 3px 0 3px 26px;
  background-position: 0 1px;
}

/* Software */
.software {
  width: 394px;
  border: 3px solid #000;
  float: left;
  margin: 0 10px;
  display: inline;
  padding: 30px;
  color: #000;
  font-size: 13px;
}
.software.hover {
  border-color: #0c5a00;
  color: #0c5a00;
}
#jrbutils_nw.software h3 {
  height: 0;
  width: 128px;
  padding-top: 41px;
  background: url(images/h3_jrbutils-micro.gif) 0 0 no-repeat;
  overflow: hidden;
  float: left;
  margin: 0;
}
#jrbutils_ad.software h3 {
  height: 0;
  width: 128px;
  padding-top: 41px;
  background: url(images/h3_jrbutils-ad.gif) 0 0 no-repeat;
  overflow: hidden;
  float: left;
  margin: 0;
}
.software p {
  margin-left: 154px;
  padding: 0;
}
.software a {
  width: 54px;
  height: 54px;
  background: url(images/learnmore.gif) 0 0 no-repeat;
  display: inline;
  float: left;
  clear: left;
  margin: 10px 0 0 39px;
}
.software a:hover,
.software.hover a {
  background: url(images/learnmore.gif) -54px 0 no-repeat;
}
.two-option-dl {
  display: inline;
  margin-right: 30px;
}
.downloads {
  margin: 25px 0;
}
#success .conditions {
  padding-top: 10px;
}

/* Blog */
#home #latestblog {
  float: left;
  padding: 36px 20px 12px 20px;
  width: 920px;
}
#home #latestblog .entry {
  float: left;
  width: 100%;
}
#home #latestblog a {
  text-decoration: none;
}
#home #latestblog a:hover {
  color: #000;
}
#home #latestblog a.read {
  width: 115px;
  height: 92px;
  background: url(images/readblog.gif) 0 0 no-repeat;
  display: inline;
  float: right;
  margin: 0 10px 0 30px;
}
#home #latestblog a.read:hover {
  background: url(images/readblog.gif) -115px 0 no-repeat;
}
#latestblog h2 {
  font-size: 30px;
  line-height: 30px;
  margin: 0 165px 0 10px;
}
#latestblog p {
  padding: 6px 165px 6px 10px;
}
#blog #right h3 {
  margin: 30px 0 4px 0;
  line-height: 18px;
}
#blog h3 span {
  float: right;
  font-size: 10px;
  font-style: italic;
  color: #aaa;
}
#blog h2 span {
  display: block;
  font-size: 11px;
  color: #aaa;
}
#blog h2 span strong {
  font-weight: normal;
  text-transform: uppercase;
}
#blog #right ul {
  margin: 12px 0;
}
#blog #right li {
  background: none;
  padding: 0;
  font-size: 11px;
  line-height: 14px;
  display: inline;
}
#blog #right li a {
  border-bottom: 1px solid #0c5a00;
  text-decoration: none;
  display: block;
  padding: 3px 9px;
}
#blog #right li a:hover,
#blog #right li.on a {
  border-bottom: 1px solid #000;
  color: #000;
}

/* Forms */
#error {
  color: #990000;
  font-size: 10px;
  display: none;
}
dd textarea.required,
dd input.required,
input.required {
  border: 1px solid #990000;
  color: #990000;
}

/* Carousel */
#utilities {
  width: 140px;
  position: relative;
}
.fixedpane {
  padding: 30px 0 0 0;
  width: 140px;
  text-align: center;
  position: fixed;
}
#jrbutils_nw.notes .fixedpane {
}
#jrbutils_ad.notes .fixedpane {
}
.prev {
  width: 9px;
  height: 8px;
  position: absolute;
  top: 102px;
  left: 50%;
  margin: 0 0 0 -5px;
  z-index: 10;
  background: url(images/prev.gif) 0 0 no-repeat;
}
#jrbutils_ad .prev {
  top: 18px;
}
#jrbutils_nw.notes .prev {
  top: 18px;
}
.prev:hover {
  background: url(images/prev.gif) 0 -8px no-repeat;
}
.next {
  width: 9px;
  height: 8px;
  position: absolute;
  bottom: -12px;
  left: 50%;
  margin: 0 0 0 -5px;
  z-index: 10;
  background: url(images/next.gif) 0 0 no-repeat;
}
.next:hover {
  background: url(images/next.gif) 0 -8px no-repeat;
}
ul.pager {
  width: 101px;
  height: 64px;
  background: url(images/pager.gif) 50% 0 no-repeat;
  margin: 0 21px 20px 18px;
  position: relative;
}
ul.pager li {
  background: none;
  padding: 0;
  position: absolute;
}
ul.pager li a {
  width: 31px;
  height: 30px;
  display: block;
}
ul.pager li#atof {
  left: 0;
  top: 0;
}
ul.pager li#atof a:hover,
ul.pager li#atof.on {
  background: url(images/pager.gif) 0 -64px no-repeat;
}
ul.pager li#gtoj {
  left: 35px;
  top: 0;
}
ul.pager li#gtoj a:hover,
ul.pager li#gtoj.on {
  background: url(images/pager.gif) -35px -64px no-repeat;
}
ul.pager li#ktoo {
  left: 70px;
  top: 0;
}
ul.pager li#ktoo a:hover,
ul.pager li#ktoo.on {
  background: url(images/pager.gif) -70px -64px no-repeat;
}
ul.pager li#ptor {
  left: 0;
  top: 34px;
}
ul.pager li#ptor a:hover,
ul.pager li#ptor.on {
  background: url(images/pager.gif) 0 -98px no-repeat;
}
ul.pager li#s {
  left: 35px;
  top: 34px;
}
ul.pager li#s a:hover,
ul.pager li#s.on {
  background: url(images/pager.gif) -35px -98px no-repeat;
}
ul.pager li#ttoz {
  left: 70px;
  top: 34px;
}
ul.pager li#ttoz a:hover,
ul.pager li#ttoz.on {
  background: url(images/pager.gif) -70px -98px no-repeat;
}
.carousel {
  border: 2px solid #000;
  padding: 0;
  width: 110px;
  margin: 0 auto;
}
.carousel ul {
  margin: 0 0 0 5px;
}
.carousel li {
  background: none;
  padding: 3px 0;
}
.carousel a {
  color: #000;
  text-decoration: underline;
}
.carousel a:hover {
  text-decoration: none;
}
.carousel a.on,
h3.on {
  color: #0c5a00;
}

/* Typography */
ol,
ul,
dl {
  margin: 12px 0;
}
ul li ul {
  margin: 2px 0 12px 0;
}
table {
  margin: 12px 12px;
  background: #efefef;
  font-size: 11px;
  line-height: 16px;
  color: #777;
}
td {
  padding: 3px 6px;
}
li {
  padding: 0 40px;
  background: url(images/bullet.gif) 26px 5px no-repeat;
}
ol.ordered li {
  list-style: decimal;
  background: none;
  padding: 0;
  margin: 0 40px;
}
ol li {
  padding: 3px 40px 3px 52px;
}
ol li.one {
  background: url(images/1.gif) 26px 1px no-repeat;
}
ol li.two {
  background: url(images/2.gif) 26px 1px no-repeat;
}
ol li.three {
  background: url(images/3.gif) 26px 1px no-repeat;
}
ol li.four {
  background: url(images/4.gif) 26px 1px no-repeat;
}
ol li.five {
  background: url(images/5.gif) 26px 1px no-repeat;
}
ol li.six {
  background: url(images/6.gif) 26px 1px no-repeat;
}
ol li.seven {
  background: url(images/7.gif) 26px 1px no-repeat;
}
ol li.eight {
  background: url(images/8.gif) 26px 1px no-repeat;
}
ol li.nine {
  background: url(images/9.gif) 26px 1px no-repeat;
}
ol li.ten {
  background: url(images/10.gif) 26px 1px no-repeat;
}

.inline li {
  background: none;
  line-height: 24px;
}
.inline li span {
  color: #000;
  width: 100px;
  display: block;
  float: left;
  padding: 0 20px 0 0;
}
#order .inline span {
  width: 160px;
}
#copy ul li {
  margin-bottom: 8px;
}
#order .nw_options span {
  width: 280px;
}
h1 {
  color: #000;
  font-size: 24px;
  line-height: 24px;
  margin: 30px 10px 24px 10px;
  font-weight: bold;
}
#home h1 {
  text-align: center;
  background: url(images/manage.gif?id=061112) 50% 0 no-repeat;
  height: 0;
  padding-top: 185px;
  overflow: hidden;
  text-align: center;
  position: relative;
}
#home h1 a {
  position: absolute;
  left: 374px;
  bottom: 17px;
  width: 208px;
  height: 43px;
}

/* note the ?id=061112, this is to prevent caching and force the browser to load a new version of the title images */
#home h1 a:hover {
  background: url(images/findouthow.gif?id=061112) 0 0 no-repeat;
}
/*#jrbutils_nw.utils h1 { height: 0; padding-top: 18px; background: url(images/h1_utils-nw.gif?n=1) no-repeat; overflow: hidden; }
#jrbutils_nw.overview h1 { height: 0; padding-top: 18px; background: url(images/h1_overview-nw.gif?n=1) no-repeat; overflow: hidden; }
#jrbutils_nw.enhancements h1 { height: 0; padding-top: 18px; background: url(images/h1_enhancements-nw.gif?n=1) no-repeat; overflow: hidden; }
#jrbutils_nw.notes h1 { height: 0; padding-top: 18px; background: url(images/h1_notes-nw.gif?n=1) no-repeat; overflow: hidden; }
#jrbutils_nw.choosing h1 { height: 0; padding-top: 18px; background: url(images/h1_choosing-nw.gif?n=1) no-repeat; overflow: hidden; }
*/

h1 {
  line-height: 18px;
  font-size: 19px;
  font-weight: normal;
}
h1 span {
  padding: 0 3px;
  line-height: 18px;
  font-style: italic;
  font-size: 14px;
  font-weight: normal;
  color: #8e8e8e;
}

h2 {
  color: #8e8e8e;
  margin: 36px 10px 6px 10px;
  font-size: 18px;
  line-height: 20px;
}
h2#subject {
  margin: 0;
  height: 0;
  padding-top: 36px;
  width: 625px;
  background: url(/images/subject-new.png) no-repeat;
  overflow: hidden;
  position: absolute;
  top: 75px;
  left: 158px;
}
h2#subject_nw {
  margin: 0;
  height: 0;
  padding-top: 36px;
  width: 625px;
  background: url(http://jrbsoftware.com/images/subject_nw.png?r=r) no-repeat;
  overflow: hidden;
  position: absolute;
  top: 75px;
  left: 158px;
}
h2#subject_utils {
  margin: 0;
  height: 0;
  padding-top: 36px;
  width: 625px;
  background: url(http://jrbsoftware.com/images/subject_utils.png) no-repeat;
  overflow: hidden;
  position: absolute;
  top: 75px;
  left: 158px;
}
h2#subject_ad {
  margin: 0;
  height: 0;
  padding-top: 36px;
  width: 625px;
  background: url(http://jrbsoftware.com/images/subject_ad.gif) no-repeat;
  overflow: hidden;
  position: absolute;
  top: 75px;
  left: 158px;
}

h3 {
  color: #000;
  margin: 24px 10px 4px 10px;
  font-size: 16px;
  line-height: 18px;
}
p {
  padding: 6px 10px;
}
strong {
  font-weight: bold;
}
em {
  font-style: italic;
  color: #000;
}
.hidden,
#search input.hidden {
  display: none;
}
.conditions,
#sub p {
  font-size: 11px;
  line-height: 16px;
  color: #777;
}
#sub {
  margin: 42px 0 0 0;
}
#sub h3 {
  margin: 12px 0 0 0;
  font-size: 13px;
  line-height: 13px;
}
#sub p {
  padding: 4px 0;
}
pre {
  margin: 0 10px;
  padding: 9px 18px;
  background: #fff;
  border: 2px solid #ccc;
  color: #555;
  font-family: "Lucida Console", "Courier New", sans-serif;
}
.article_img {
  border: 2px solid #ccc;
}
blockquote {
  color: #555;
  margin: 6px 30px;
  font-size: 12px;
  line-height: 18px;
}

.wht blockquote {
  color: #fff;
  margin: 6px 30px;
  font-size: 16px;
  line-height: 20px;
}
.individual blockquote {
  color: #555;
  margin: 6px 30px;
  font-size: 12px;
  line-height: 18px;
}
#jrbutils_ad blockquote {
  color: #555555;
  margin: 6px 30px;
  font-size: 12px;
  line-height: 120%;
}
span.control {
  display: block;
  float: left;
  width: 30px;
}
/* Links */
a {
  text-decoration: underline;
  color: #0c5a00;
}
a:hover {
  text-decoration: none;
}
a img {
  border: 0;
}

/* Forms */
dl {
  margin: 12px 20px 0 10px;
}
dt {
  font-weight: normal;
  margin: 8px 0 0 0;
}
dt span {
  float: right;
  font-size: 11px;
  line-height: 16px;
  color: #777;
}
dd input {
  width: 100%;
  font-size: 12px;
  line-height: 18px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #000;
}
dd.hear label {
  font-size: 11px;
  line-height: 18px;
  color: #777;
  display: block;
}
dd.hear input {
  width: auto;
}
dd.hear input.text {
  width: 100%;
}

dl.sublist {
  display: flex;
  flex-flow: row;
  flex-wrap: wrap;
  width: 100%; /* set the container width*/
  overflow: visible;
}

dl.sublist dt {
  /* font-weight: normal;
  margin: 8px 0 0 0;
  float: left;
  width: 40px;
  padding: 0;
  clear: left; */
  flex: 0 0 10%;
  text-overflow: ellipsis;
  overflow: hidden;
  margin: 8px 0 0 0;
  text-align: center;
}

dl.sublist dd {
  flex: 0 0 90%;
  margin-left: auto;
  text-align: left;
  text-overflow: ellipsis;
  overflow: hidden;
  margin: 8px 0 0 0;
  /* font-weight: normal;
  margin: 8px 0 0 0;
  float: left;
  width: 400px;
  padding: 0; */
}

dd.checkbox label {
  font-size: 11px;
  line-height: 18px;
  color: #777;
  display: block;
}
dd.checkbox input {
  width: auto;
}
dd.checkbox input.text {
  width: 100%;
}
p#total_price {
  color: #000;
  padding-top: 10px;
}

dd textarea {
  width: 100%;
  font-size: 12px;
  line-height: 18px;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  color: #000;
}
p.submit {
  text-align: right;
  padding: 12px 10px;
}
p.submit input {
  width: auto;
}
.submit span {
  font-size: 11px;
  line-height: 12px;
  color: #000;
  float: left;
  width: 220px;
  text-align: left;
}
.renew {
  float: left;
  margin: 0 20px 0 0;
  display: inline;
}
.renew input {
  float: left;
}
.renew input.button {
  margin: 0 0 0 4px;
}

/* Payment Logos (Visa and Mastercard) */
.order__payment_logos_container .order__payment_logo {
  height: 50px;
  margin-right: 20px;
}

.payment_complete_header {
  font-size: 2em;
  margin-bottom: 10px;
}

/* Footer */
#footer {
  float: left;
  background: url(images/footer.gif) 0 0 repeat-x;
  font-size: 11px;
  line-height: 16px;
  padding: 0 0 24px 0;
}
#contact dl {
  margin: 24px 10px 0 10px;
  float: left;
  width: 220px;
  display: inline;
}
#contact dt {
  color: #000;
  font-weight: normal;
}
#footer p {
  float: left;
  width: 440px;
  padding: 0;
  margin: 16px 10px 0 10px;
  display: inline;
}
#footer .time {
  display: block;
  margin: 16px 0 0 0;
}
#footer em {
  color: #666;
}
