@charset "utf-8";
/* we set.*/
html { overflow-y: scroll; }
html, div, p, textarea, form { font-size: 100%; margin: 0; padding: 0; }
p { text-indent: 0; }
h1, h2, h3, h4, h5, h6 {
  font-style: normal;
  font-weight: normal;
  margin: 0;
  padding: 0;
}
ol, ul, li, dl, dt, dd {
  margin: 0;
  padding: 0;
  font-weight: normal;
  list-style-image: none;
  list-style-position: outside;
  list-style-type: none;
}
a, a img, img, object {
  background-color:transparent;
  border: 0;
  padding: 0;
  text-decoration: none;
}
a { vertical-align:baseline; background:transparent; }
/* code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/ */
.ie7 img { -ms-interpolation-mode: bicubic; }
input, textarea, select {
  font-family: inherit;
  font-size: 100%;
  font-weight: inherit;
  margin: 0;
}
/* viget.com/inspire/styling-the-button-element-in-internet-explorer/ */
button {  width: auto; overflow: visible; margin: 0; }
/* sitepoint.com/blogs/2010/08/20/ie-remove-textarea-scrollbars/ */
textarea { overflow: auto; }
input, select { vertical-align:middle; }
/* tjkdesign.com/ez-css/css/base.css  */
input[type="radio"] { vertical-align: text-bottom; }
input[type="checkbox"] { vertical-align: bottom; }
.ie6 legend, .ie7 legend { margin-left: -7px; }
.ie7 input[type="checkbox"] { vertical-align: baseline; }
.ie6 input { vertical-align: text-bottom; }
label, input[type=button], input[type=submit], button { cursor: pointer; }
em { font-style: italic; }
strong { font-weight: bold; }
strike { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom:0; cursor: text; }
blockquote, q { quotes: none; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {
  display: block;
  margin: 0;
}
/* and set some more, */
html, body {
  height:100%;
  min-height:100%;
  width:100%;
}
body { 
  background-color: #f5f5f5;
  color: #282828;
  font: 100% 'Helvetica Neue',Helvetica,Arial,sans-serif;
  letter-spacing: 0.05em;
  line-height: 1.5em; /* 16×1.5=24 */
  margin: 0;
  padding: 0;
}
h2  {
  font-size: 80px;
  line-height: 60px;
  font-weight: bold;
  letter-spacing: 2px;
}
h3 { font-size: 1.5em; line-height: 1.25em; }
h4 { font-size: 1.25em; line-height: 1.25em; }
h5 { font-size: 1.125em; line-height: 1.375em; }

a { color: #5D2E0C; }
a:hover { color: #f71; }
a:focus { color:#7a7a7a; }
a.aimg { display: block; padding:0; }
a.aimg:active, a.aimg:focus { outline: 0; }
a.dblock { display: block; }
a.dblock:active, a.dblock:focus { outline: 0; }
.figure { margin: 0.75em 0 0.25em; }
/* then we start making boxes. */
.outer {
  height:100%;
  min-height:100%;
  width: 100%;
}
html>body .outer {
  height: auto;
}
.inner {
  width: 256px;
  height: auto;
  position: relative;
  margin: 0 auto;
  padding: 64px 0 128px;
  text-align: center;
}
.masthead {
  width: 152px;
  height: 185px;
  background-image: url(kb-logo.png);
  background-position: center top;
  margin: 0 auto;
  text-indent: -9999px;
}

.mailbox {
padding-top: 0.25em;
padding-left: 0.125em;
}

#kbheader { 
  float:left;
  margin:0;
  min-width:48em;
  text-align:left;
  width:100%;
}
#kyl { 
  float:right;
  max-width:24%;
  padding:0.375em 0.25em 0 0;
}
#kyl a:link, #kyl a:active, #kyl a:visited, #kyl a:hover {
  padding: 0;
  text-decoration:none;
  color:#444;
  background-color: transparent;
}

/* form boxes + margins */
.kindle { position: absolute; left: -9999px; top: -9999px; margin:0; }
/* may need to add width/height, depending on the layout */
.responsebox {
  clear:both;
  color:#E31E25;
  display:block;
  font-weight:bold;
  min-height:2em;
  margin-top:1em;
  text-align:left;
}
.formresponse, .voxresponse { padding-left:8px }
/* form elements */
.itext {
  width: 80%;
  min-width: 240px;
  z-index: 999;
  background-color: #f5f5f5;
  color: #484848;
  font-size: 0.875em;
  margin-bottom: 0.75em;
  padding: 0.625em 0.5em 0.75em;
  border-top: 1px solid #aaa;
  border-right: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  border-left: 1px solid #aaa;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
  -moz-background-clip: padding-box;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
}
.itext {
  border-top: 1px solid rgba(170,170,170,.8);
  border-right: 1px solid rgba(170,170,170,.6);
  border-bottom: 1px solid rgba(170,170,170,1);
  border-left: 1px solid rgba(170,170,170,.6);
}
.itext:focus {
  border: 1px solid #8af;
  -webkit-box-shadow: 0 0 8px rgba(85,85,255,.6);
  -moz-box-shadow: 0 0 8px rgba(85,85,255,.6);
  box-shadow: 0 0 8px rgba(85,85,255,.6);
}
.itext:focus { border: 1px solid rgba(85,85,255,.6); }
.error:focus {
  border: 1px solid #f98;
  -webkit-box-shadow: 0 0 8px rgba(255,85,85,.6);
  -moz-box-shadow: 0 0 8px rgba(255,85,85,.6);
  box-shadow: 0 0 8px rgba(255,85,85,.6);
}
.error:focus {
  border: 1px solid rgba(255,85,85,.6);
}
textarea {
  -moz-resize: vertical;
  -webkit-resize: vertical;
  resize: vertical;
}
.btnbox {
  font-size: 1em;
  line-height: 2em;
  min-height: 2em;
}
.btnbkd, a.btnbkd {
  background-color: #f5f5f5;
  border: 1px solid #a3a3a3;
  padding: 0.25em 0.5em 0.375em;
  text-shadow:0 1px 2px rgba(0,0,0,.1);
  border-radius:0.375em;
  -webkit-box-shadow:0 1px 2px rgba(0,0,0,.2);
  -moz-box-shadow:0 1px 2px rgba(0,0,0,.2);
  box-shadow:0 1px 2px rgba(0,0,0,.2);
  background-image:-moz-linear-gradient(top, #f5f5f5, #d7d7d7);
  background-image:-webkit-gradient(linear, left top, left bottom, from(#f5f5f5), to(#d7d7d7));
  filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#f5f5f5', EndColorStr='#d7d7d7');
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#f5f5f5', EndColorStr='#d7d7d7')";
}
.btnbkd, a.btnbkd {
  border-top: 1px solid rgba(170,170,170,.8);
  border-right: 1px solid rgba(170,170,170,.6);
  border-bottom: 1px solid rgba(170,170,170,1);
  border-left: 1px solid rgba(170,170,170,.6);
}
.btnbkd:hover, .btnbkd:focus, a.btnbkd:hover, a.btnbkd:focus  {
  background-color:#f0f0f0;
  border:1px solid #8af;
  -webkit-box-shadow:0 0 8px rgba(85,85,255,.6);
  -moz-box-shadow:0 0 8px rgba(85,85,255,.6);
  box-shadow:0 0 8px rgba(85,85,255,.6);
  background-image: -moz-linear-gradient(rgb(255, 255, 255) 50%, rgb(212, 212, 212) 100%);
  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(50%, rgb(255, 255, 255)), color-stop(100%, rgb(212, 212, 212)));
  filter:  progid:DXImageTransform.Microsoft.gradient(startColorStr='#f5f5f5', EndColorStr='#d4d4d4');
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#f5f5f5', EndColorStr='#d4d4d4')";
}
.btnbkd:hover, .btnbkd:focus, a.btnbkd:hover, a.btnbkd:focus  {
  border:1px solid rgba(85,85,255,.6);
}
.btnbkd:active, a.btnbkd:active {
  border:1px solid #ddf;
  -webkit-box-shadow:0 -1px 1px rgba(0,0,0,.4);
  -moz-box-shadow:0 -1px 1px rgba(0,0,0,.4);
  box-shadow:0 -1px 1px rgba(0,0,0,.4);
}
.btnbkd:active, a.btnbkd:active {
  border:1px solid rgba(0,0,0,.2);
}
.btnbkd::-moz-focus-inner { border:0; } /* FF */
.btnbkd:focus { outline:0; } /* IE8 */

/* helpers */
.rgb8 { color: #141414; }
.rgb61 { color: #3d3d3d; }
.rgb82 { color:#525252; }
.rgb163 { color: #a3a3a3; }
.rgb143 { color: #8f8f8f; }
.rgb184 { color: #b8b8b8; }
.rgb204 { color: #ccc; }
.rgb245 { color: #f5f5f5; }

.espresso { color: #3A1D00; }
.zred {  color: #b01; }
.clementine { color:#d84; }
.eggplant { color:#86a; }
.keylime { color:#9b5; }
.orangine { background-color:#eeece1; border-color:#e18c46; }
.oliveoil { background-color:#dcdcd6; border-color:#8c9774; }

.bordeaux { 
  border-width: 1px;
  border-style: solid;
  padding: 1em;
  margin: 1.25em;
}
.vabot { vertical-align: bottom; }
.tacen { text-align: center; }
.taleft { text-align: left; }
.taright { text-align: right; }
.toupper { text-transform: uppercase; }
.loosen { letter-spacing: 0.05em; }
.loosen2 { letter-spacing: 0.1em; }
.lh3-2 { line-height: 1.5em; }
.lh21-16 { line-height: 1.3125em; }
.lh5-4 { line-height: 1.25em; }
.lh19-16 { line-height: 1.1875em; }
.lh9-8 { line-height: 1.125em; }
.lh17-16 { line-height: 1.0625em; }
.lh1 { line-height: 1em; }
.lh15-16 { line-height: 0.9375em; }
.enlarged { font-size: 1.25em; } /* to show texture */
.enlarged3-2 { font-size: 1.5em; }
.byline { font-size: 0.9375em; }
.footnote { font-size: 0.875em; }
.endnote { font-size: 0.75em; }
.thinner { font-weight: lighter; }

.mt2 { margin-top: 2em; }
.mttrp { margin-top: 0.75em; }
.mbhsp { margin-bottom: 0.125em; }
.pl8 { padding-left: 8px; }
.pt24 { padding-top: 24px; }
.pt32 { padding-top: 32px; }
.dbsp { padding-top: 0.25em; }
.trpsp { padding-top: 0.5em; }
.quadsp { padding-top: 0.75em; }
.quintsp { padding-top: 1em; }
.dbsb { padding-bottom: 0.25em; }
.trpsb { padding-bottom: 0.5em; }
.quadsb { padding-bottom: 0.75em; }
.quintsb { padding-bottom: 1em; }
.pb9-8 { padding-bottom: 1.125em; }
.pb22-16 { padding-bottom: 1.375em; }

/* precedence */
video { font-size: 0.5625em; font-weight: bold; } /* for timecode in Safari */
.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }
.hidden { display: none; visibility: hidden; }
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
.invisible { visibility: hidden; }
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }
.cle { clear: both; height: 0.25em; margin: 0.25em 0; }
.clearboth { clear: both; }