/* Cheddar, ported from the classic custom CSS: the dark #414141 top bar and
   header band, green #7ea230 links, headings and buttons, the uppercase bold
   nav, the green "Log in" pill, the orange #e39812 staff comment header, and
   the Trade Gothic stack (the site's custom HTML still loads TradeGothic.css
   from getcheddar.com). Dropped: the 1170px widths, the card shadows, the
   big buttons, pagination, kb-search, flash and table rules for the classic
   markup, and the !important overrides. */

/* type and links */
body.tn-frontend {
  --tn-font: "TradeGothicLT", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --tn-link: #7ea230;
  --tn-link-hover: #5f7e1d;
}
.tn-frontend strong, .tn-frontend b,
.tn-frontend #content :is(h1, h2, h3), .tn-frontend #superheader #tender_nav, .tn-frontend #superheader .welcome {
  font-family: "TradeGothicLT-Bold", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 700;
}
.tn-frontend #content :is(h1, h2, h3) { color: #7ea230; }
.tn-frontend #content .home-staff h2 { color: var(--tn-muted); }  /* the shell's small label stays grey */

/* green primary buttons: .btn, the old .gbutton, submits and the header's search button */
.tn-frontend :is(.btn, .gbutton, input[type=submit], #search button) { --tn-brand: #7ea230; --tn-brand-hover: #5f7e1d; }

/* the top bar: uppercase bold nav, the green "Log in" pill (their JS makes the whole pill a link) */
.tn-frontend #superheader #tender_nav { text-transform: uppercase; letter-spacing: .5px; }
.tn-frontend #superheader .welcome { margin: 0; padding: 6px 12px; font-size: 11px; line-height: 1.4; color: #fff; text-transform: uppercase; letter-spacing: .5px; background: #7ea230; border-radius: var(--tn-radius); cursor: pointer; }
.tn-frontend #superheader .welcome:hover { background: #5f7e1d; }
.tn-frontend #superheader .welcome a { color: #fff; opacity: 1; }
/* logged in: the account links on a darker rounded box, in green */
.tn-frontend #superheader #user_nav { margin: 6px 0; padding: 0 6px; background: #2d2d2d; border-radius: 6px; }
.tn-frontend #superheader #user_nav li a { padding: 7px 8px; color: #7ea230; }

/* the header band: dark like the top bar, edge to edge behind the logo; a white search field on it */
.tn-frontend #header {
  margin-bottom: 24px;
  background: #414141;
  box-shadow: 0 0 0 100vmax #414141;
  clip-path: inset(0 -100vmax);
}
.tn-frontend #search input.searchfield { color: #414141; background: #fff; border-color: #fff; }
.tn-frontend #search input.searchfield::placeholder { color: #8d8d8d; }

/* staff comments: an orange header bar with white text, an orange ring on the avatar */
.tn-frontend #content .comment-list > li.staffer:not(.internal) > .comment-header { color: #fff; background: #e39812; border-color: #e39812; }
.tn-frontend #content .comment-list > li.staffer:not(.internal) > .comment-header :is(.number, .number:hover, .author-name, .author-name a, .author-name a:hover, .idtag, .date),
.tn-frontend #content .comment-list > li.staffer:not(.internal) > .comment-header .idtag::before { color: #fff; }
.tn-frontend #content .comment-list > li.staffer:not(.internal) > .comment-header .admin-functions .action { color: rgba(255, 255, 255, .85); }
.tn-frontend #content .comment-list > li.staffer:not(.internal) > .comment-header .admin-functions .action em { color: inherit; }
.tn-frontend #content .comment-list > li.staffer:not(.internal) > .comment-header .admin-functions .action:hover { color: #fff; background: #c27e05; }
.tn-frontend .comment-list > li.staffer > .avatar { box-shadow: 0 0 0 2px var(--tn-surface), 0 0 0 4px #e39812; }

/* the table of contents their knowledge base articles use */
.tn-frontend ol.table_of_contents { padding: 15px; background: #efefef; border: 1px solid #d1d1d1; border-radius: var(--tn-radius); }
.tn-frontend .table_of_contents ol { margin: 3px 0; }
.tn-frontend .table_of_contents li { padding-bottom: 5px; font-size: 12px; font-weight: 700; }

/* ---- Your custom CSS from before the new design ----
   It was written for the old pages, so it's switched off: it's all inside
   this comment, with its own comments ending in "* /". It's here for
   reference; delete it whenever you like.

body { font-family:"TradeGothicLT", "Helvetica Neue", Helvetica, Arial, sans-serif; padding:0; margin:0; }
ul,ol,li {color:#727375; font-size:15px; }
li {}
li a {color:#7ea230;}
li a:hover, li a:focus {color:#5f7e1d;}
li p {font-family:"TradeGothicLT", "Helvetica Neue", Helvetica, Arial, sans-serif;font-weight:normal;}
h1,h2,h3,h4,h5 { font-family:"TradeGothicLT-Bold", "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight:bold; color:#7ea230; }
h1 { font-size:24px; }
h2 { font-size:20px !important; }
h3 { font-size:16px !important; }
h4 { font-size:14px; }
h5 { font-size:13px;color:#414141; }
p { font-size:15px;color:#414141; }
a { color:#7ea230; text-decoration:underline; }
a:hover { color:#5f7e1d; }

.table_of_contents ol, .table_of_contents li, .table_of_contents a {
  font-family:"TradeGothicLT-Bold", "Helvetica Neue", Helvetica, Arial, sans-serif; font-weight:bold;
  font-size:12px;
  padding-bottom:0px;
  color:#73a230;
}

ol.table_of_contents {
  padding: 15px;
  border: 1px solid #d1d1d1;
  border-color: #d1d1d1;
  background-color: #efefef;
}

.table_of_contents ol {
  margin-top:3px;
  margin-bottom:3px;
}

.table_of_contents li {
  padding-bottom:5px;
}

.original-post .custom-fields li {
  font-family:"TradeGothicLT", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight:normal;
  font-size:12px;
}

ol#comments li {
  font-family:"TradeGothicLT", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight:normal;
  font-size:12px;
}

p.welcome {
  font-size:11px;
  margin-top:8px !important;
  background-color:#7ea230;
  padding: 6px 12px;
  cursor:pointer;
}

blockquote {
  font-family:"TradeGothicLT", "Helvetica Neue", Helvetica, Arial, sans-serif;
  border-left: 3px solid;
  border-left-color:#c0c0c1;
}

blockquote p {
  color:#939393;
  font-size:13px;
}

.footerbox .column {
  width:50%;
}

.sidebar h3 {font-size:20px;}

strong {font-family:"TradeGothicLT-Bold", "Helvetica Neue", Helvetica, Arial, sans-serif;}

.flash {
  color:#ffffff;
  background-color:#6093b4;
}
#header, #content, #footer, #superheader .inner {
  width:auto !important;
  max-width:1170px !important;
}

#content h1 {
  font-family:"TradeGothicLT-Bold", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight:bold;
  color:#7ea230 !important;
}


#superheader {
  background-color:#414141 !important;
  color:#ffffff !important;
  border-bottom:none !important;
  padding-bottom:15px;
}
ul#tender_nav {
  font-weight:bold;
  font-family:"TradeGothicLT-Bold", "Helvetica Neue", Helvetica, Arial, sans-serif;
  text-transform:uppercase;
  letter-spacing:.5px;
  font-size:13px;
  padding-top:17px;
}

ul#tender_nav li {
  font-size:13px;
}

#superheader ul.gnav li {
  border-color:#555555 !important;
}

#superheader ul.gnav.first {
  padding-top: 15px;
}

#superheader ul.gnav a {
  color:#7ea230 !important;
}

#superheader ul#tender_nav a {
  color:#ffffff !important;
    font-smooth: always; 
  -webkit-font-smoothing: antialiased; 
  font-smoothing: antialiased;
}
#superheader ul#tender_nav a:hover {
  opacity:0.8;
}

p.welcome {
  margin-top:10px;
  background-color: #7ea230 !important;
  background:#7ea230;
  border-bottom-color: transparent !important;
  border-right-color: transparent !important;
  border-top-color: transparent !important;
  border-left-color: transparent !important;
  border-radius:0px !important;
  color: #FFFFFF !important;
  text-shadow: none !important;
  font-family:"TradeGothicLT-Bold", "Helvetica Neue", Helvetica, Arial, sans-serif;
  text-transform:uppercase;
  letter-spacing:.5px;
  font-smooth: always; 
  -webkit-font-smoothing: antialiased; 
  font-smoothing: antialiased;
}

p.welcome:hover, p.welcome:focus, p.welcome:active {
  background:#5f7e1d !important;
} 

ul#user_nav {
  background-color: #2d2d2d;
  border-radius: 6px;
  padding: 10px;
  padding-top:8px !important;
  margin-top: 8px !important;
}

ul#user_nav li {
  font-size:11px;
  color:#e39812;
}

#header {
  background-color:#414141 !important;
  padding:20px;
  box-shadow: 1px 0px 8px rgba(114, 115, 117, 0.25) !important;
  margin-bottom:0px !important;
  border-bottom:transparent !important;
}

#header h2 {
  margin-top:0px !important;
}

.mobile #mobile-header .toggle {
  color:#7ea230 !important;
  border-color: #7ea230 !important;
}


#header #search {
  bottom:15px !important;
  right: 20px !important;
}

.gbutton, a .gbutton {
 background-color: #7ea230 !important;
 background:#7ea230;
 border-bottom-color: transparent !important;
 border-right-color: transparent !important;
 border-top-color: transparent !important;
 border-left-color: transparent !important;
  border-radius:0px !important;
 color: #FFFFFF !important;
 text-shadow: none !important;
  font-family:"TradeGothicLT-Bold", "Helvetica Neue", Helvetica, Arial, sans-serif;
  text-transform:uppercase;
  letter-spacing:.5px;
    font-smooth: always; 
  -webkit-font-smoothing: antialiased; 
  font-smoothing: antialiased;
}

.gbutton:hover, .gbutton:focus, .gbutton:active {
	background:#5f7e1d !important;
} 

#search .searchfield {
  background-color: #ffffff;
  color: #414141;
  font-family:"TradeGothicLT-Bold", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight:bold;
  border: 1px solid #cccccc;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

#search::-webkit-input-placeholder {
            color:    #8d8d8d !important;
}
#search:-moz-placeholder {
        color:    #8d8d8d !important;
}
#search::-moz-placeholder {
        color:    #8d8d8d !important;
}
#search:-ms-input-placeholder {
        color:    #8d8d8d !important;
}

#wrapper {
  background-color:#ededed !important;
}

#page {
  background-color:#ededed !important;
  width:auto !important;
  max-width:1170px !important;
}

#content {
  background-color:#fcfcfc !important;
  padding:20px;
  color:#414141 !important;
  -webkit-box-shadow:0 4px 8px rgba(114, 115, 117, 0.25);
  -moz-box-shadow:0 4px 8px rgba(114, 115, 117, 0.25);
  box-shadow:0 4px 8px rgba(114, 115, 117, 0.25);
}

.bigbuttons .bigbutton {
  background-color:#7ea230;
  width:31.5%;
  margin-right:31px;
}

.bigbuttons .bigbutton:hover {
  background:#5f7e1d !important;
}

.bigbuttons .last {
  margin-right:0px !important;
}

.bigbuttons .bigbutton a {
  width: 90%;
  background-color:#7ea230 !important;
  color:#ffffff !important;
  text-transform:uppercase;
  letter-spacing:.5px;
  cursor:pointer;
  border-radius:0px;
  font-smooth: always; 
  -webkit-font-smoothing: antialiased; 
  font-smoothing: antialiased;
}

.bigbuttons .bigbutton a:hover {
  background:#5f7e1d !important;
}

.bigbutton h2 span {
  color:#ffffff !important;
  font-smooth: always; 
  -webkit-font-smoothing: antialiased; 
  font-smoothing: antialiased;
}
.bigbutton h2 span {
  font-size:30px !important;
  top: 8px !important;
}


.maincol {
  width:60% !important;
  background-color:#ffffff !important;
  padding:20px;
  -webkit-box-shadow:0 0 3px rgba(114, 115, 117, 0.3);
  -moz-box-shadow:0 0 3px rgba(114, 115, 117, 0.3);
  box-shadow:0 0 3px rgba(114, 115, 117, 0.3);
}

.columns .sidebar {
  width:30% !important;
  border-left:none !important;
  background-color:#ffffff !important;
  padding:20px;
  -webkit-box-shadow:0 0 3px rgba(114, 115, 117, 0.3);
  -moz-box-shadow:0 0 3px rgba(114, 115, 117, 0.3);
  box-shadow:0 0 3px rgba(114, 115, 117, 0.3);
  
}


ul.categories {
  width:100%;
  margin-left:0px;
  background-color:#ffffff !important;
  padding:0px;
  padding-top:20px;
  -webkit-box-shadow:0 0 3px rgba(114, 115, 117, 0.3);
  -moz-box-shadow:0 0 3px rgba(114, 115, 117, 0.3);
  box-shadow:0 0 3px rgba(114, 115, 117, 0.3);
}

.sent-emails {right:25px !important;}

.columns .sidebar p {
  color:#414141 !important;
  font-size:12px;
  font-family:"TradeGothicLT", "Helvetica Neue", Helvetica, Arial, sans-serif; 
  font-style:normal;
}

.supportstaffer h4 {font-size:14px;}

.supportstaffer {
  padding-bottom:10px;
}

.supportstaffer img.avatar {
  margin-right: 10px;
  margin-top: 5px;
  margin-bottom: 5px;
}

.rule {
  border-bottom:none;
}

.flash-info {
color:#ffffff !important;
  background-color:#6093b4 !important;
}

.flash-error {
color:#ffffff !important;
  background-color:#d14242 !important;
}

#footer a {
color:#7ea230 !important;
}

.kb-search {
  background-color:#ffffff;
  padding:15px;
  border-radius:0px;
}

.kb-search input.searchfield {
  width:300px;
  height:21px;
  padding-left:8px;
  font-family:"TradeGothicLT-Bold", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight:bold;
  font-size:12px;
  color:#414141;
  border: 1px solid #cccccc;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  margin-right:10px;
}

.pagination a {
  color:#7ea230;
  border-color:#7ea230;
}

.pagination a:hover, .pagination a:focus {
  color:#ffffff;
  background-color:#7ea230;
  border-color:#7ea230;
  opacity:0.75;
  font-family:"TradeGothicLT-Bold", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight:bold;
}

.pagination span.current {
  background-color:#7ea230;
  border-color:#7ea230;
}
.thread-action a {
  border-radius:0px;
  letter-spacing:1px;
}
.thread-action a.action {
  color:#7ea230;
  background-color:#fff;
  border: 1px solid #7ea230;
}

.thread-action a.action:hover, .thread-action a.action:focus {
  color:#ffffff;
  background-color:#7ea230;
  border-color:#7ea230;
  opacity:0.75;
}

ul.states li.current {
	border-left-color:#e39812;
}

ol#comments li.staffer .meta, ol#comments li.staffer .admin-functions {
  background-color:#e39812;
}

ol#comments li .admin-functions li a {
  color:#7ea230;
}

ol#comments li .admin-functions li a:hover, ol#comments li .admin-functions li a:focus {
	background-color:#7ea230;
}

ol#comments li.staffer .admin-functions li a:hover, ol#comments li.staffer .admin-functions li a:focus {
	background-color:#c27e05;
}

ul.who-is-viewing li.user-support {
color:#7ea230;
}

.original-post .admin-functions ul.actions li a {
  color:#e39812;
}

.original-post .admin-functions ul.actions li a:hover, .original-post .admin-functions ul.actions li a:focus {
  background-color:#c27e05;
  color:#fff;
}
.admin-functions {background-color:#e39812;}
.admin-functions h3 {color:#ffffff;font-size:11px;}
.admin-functions ul.actions li { color:#fff;font-size:11px;}
.admin-functions ul.actions li a { color:#ffffff; }
.admin-functions ul.actions li a:hover, .admin-functions ul.actions li a:focus { 
  background-color:#c27e05;
  color:#ffffff;
}

#article-show .maincol {
  width:auto;
}

#article-show .article {
  padding:20px;
}

#article-show .sidebar {
  padding:20px;
}
ol.search-results li.knowledgebase-article .body h1, 
ol.search-results li.knowledgebase-article .body h2, 
ol.search-results li.knowledgebase-article .body h3, 
ol.search-results li.knowledgebase-article .body h4, 
ol.search-results li.knowledgebase-article .body h5, 
ol.search-results li.knowledgebase-article .body h6 {
margin-bottom:0.5em; 
}

ol.search-results li {
  padding-bottom:15px;
}

   ---- end of your custom CSS from before the new design ---- */
