/* Typography Styles */

ul.bullet-1,
ul.bullet-2,
ul.bullet-3,
ul.bullet-4,
ul.bullet-5,
ul.bullet-6,
ul.bullet-7,
ul.bullet-8 {
  padding-left: 15px;
  overflow: hidden;
  margin-left: 5px;
}

ul.bullet-1 li,
ul.bullet-2 li,
ul.bullet-3 li,
ul.bullet-4 li,
ul.bullet-5 li {
  list-style: none;
  padding-bottom: 3px;
  margin-bottom: 5px;
  padding-left: 10px;
}

ul.bullet-6 li,
ul.bullet-7 li,
ul.bullet-8 li {
  list-style: none;
  padding-bottom: 3px;
  margin-bottom: 5px;
  padding-left: 22px;
}

ul.bullet-6 li {
  background: url('../webpage_files/typo/bullet-6.png') 0 2px no-repeat;
}

ul.bullet-7 li {
  background: url('../webpage_files/typo/bullet-7.png') 0 2px no-repeat;
}

ul.bullet-8 li {
  background: url('../webpage_files/typo/bullet-8.png') 0 3px no-repeat;
}

pre {
  padding: 10px;
}

blockquote {
  display: block;
  font-style: italic;
  font-size: 120%;
  line-height: 150%;
  width: auto;
  padding: 10px 20px 10px 20px;
  margin: 15px 0;
}

blockquote.blue,
blockquote.red,
blockquote.green,
blockquote.purple,
blockquote.orange,
blockquote.brown,
blockquote.grey {
  display: block;
  font-style: italic;
  font-size: 120%;
  line-height: 150%;
  width: auto;
  padding: 0px 20px;
  margin: 15px 0;
  border: 0;
  background: 0;
}

blockquote.blue {
  color: #0D507A;
}

blockquote.red {
  color: #D12E2E;
}

blockquote.green {
  color: #74A824;
}

blockquote.purple {
  color: #9E0E87;
}

blockquote.orange {
  color: #CC8300;
}

blockquote.brown {
  color: #8B6846;
}

blockquote.grey {
  color: #666;
}

.important,
.important-blue,
.important-red,
.important-green,
.important-purple,
.important-orange,
.important-brown,
.important-grey {
  padding: 15px;
  margin: 15px 0;
}

span.important-title,
span.important-title-blue,
span.important-title-red,
span.important-title-green,
span.important-title-purple,
span.important-title-orange,
span.important-title-brown,
span.important-title-grey {
  position: absolute;
  display: block;
  margin-top: -24px;
  padding: 0 8px;
  font-weight: bold;
  font-size: 120%;
}

.important-blue {
  border: 1px solid #0D507A;
}

.important-red {
  border: 1px solid #D12E2E;
}

.important-green {
  border: 1px solid #74A824;
}

.important-purple {
  border: 1px solid #9E0E87;
}

.important-orange {
  border: 1px solid #CC8300;
}

.important-brown {
  border: 1px solid #8B6846;
}

.important-grey {
  border: 1px solid #666;
}

span.important-title-blue {
  color: #0D507A;
}

span.important-title-red {
  color: #D12E2E;
}

span.important-title-green {
  color: #74A824;
}

span.important-title-purple {
  color: #9E0E87;
}

span.important-title-orange {
  color: #CC8300;
}

span.important-title-brown {
  color: #8B6846;
}

span.important-title-grey {
  color: #666;
}

span.number,
span.number-blue,
span.number-red,
span.number-green,
span.number-purple,
span.number-orange,
span.number-brown,
span.number-grey {
  display: block;
  font-size: 170%;
  float: left;
  margin: 2px 10px 0 15px;
}

span.number-blue {
  color: #0D507A;
}

span.number-red {
  color: #D12E2E;
}

span.number-green {
  color: #74A824;
}

span.number-purple {
  color: #9E0E87;
}

span.number-orange {
  color: #CC8300;
}

span.number-brown {
  color: #8B6846;
}

span.number-grey {
  color: #666;
}

span.highlight {
  background: #FFFBD5;
  padding: 1px 2px;
}

span.highlight-blue {
  color: #0D507A;
}

span.highlight-red {
  color: #D12E2E;
}

span.highlight-green {
  color: #74A824;
}

span.highlight-purple {
  color: #9E0E87;
}

span.highlight-orange {
  color: #CC8300;
}

span.highlight-brown {
  color: #8B6846;
}

span.highlight-grey {
  color: #666;
}

span.highlight-bold {
  font-weight: bold;
  font-size: 120%;
}

span.dropcap,
span.dropcap-blue,
span.dropcap-red,
span.dropcap-green,
span.dropcap-purple,
span.dropcap-orange,
span.dropcap-brown,
span.dropcap-grey {
  display: block;
  font-size: 260%;
  float: left;
  margin: 0px 4px 0 0;
  line-height: 100%;
}

span.dropcap-blue {
  color: #0D507A;
}

span.dropcap-red {
  color: #D12E2E;
}

span.dropcap-green {
  color: #74A824;
}

span.dropcap-purple {
  color: #9E0E87;
}

span.dropcap-orange {
  color: #CC8300;
}

span.dropcap-brown {
  color: #8B6846;
}

span.dropcap-grey {
  color: #666;
}

span.inset-left {
  display: block;
  padding: 15px;
  float: left;
  width: 20%;
  font-size: 110%;
  font-weight: bold;
  font-style: italic;
}

span.inset-right {
  display: block;
  padding: 15px;
  float: right;
  width: 20%;
  font-size: 110%;
  font-weight: bold;
  font-style: italic;
}

span.attention,
span.notice,
span.alert,
span.download,
span.approved,
span.media,
span.note,
span.cart,
span.camera,
span.doc {
  display: block;
  padding: 8px 10px 8px 36px;
  margin: 15px 0;
}

span.attention {
  color: #B79000;
  border: 1px solid #E7BD72;
  background: #FFF3A3 url('../webpage_files/typo/attention.png') 10px 50% no-repeat;
}

span.notice {
  color: #648434;
  border: 1px solid #9BCC54;
  background: #CDEFA6 url('../webpage_files/typo/notice.png') 10px 50% no-repeat;
}

span.alert {
  color: #CF3738;
  border: 1px solid #FFACAD;
  background: #FFD5D5 url('../webpage_files/typo/alert.png') 10px 50% no-repeat;
}

span.download {
  color: #1C6B8B;
  border: 1px solid #6ABCE2;
  background: #A8CDE3 url('../webpage_files/typo/download.png') 10px 50% no-repeat;
}

span.approved {
  color: #666;
  border: 1px solid #a8a8a8;
  background: #ccc url('../webpage_files/typo/approved.png') 10px 50% no-repeat;
}

span.media {
  color: #C76E34;
  border: 1px solid #FFBB65;
  background: #FFE0B6 url('../webpage_files/typo/media.png') 10px 50% no-repeat;
}

span.note {
  color: #B79000;
  border: 1px solid #E7BD72;
  background: #FFF3A3 url('../webpage_files/typo/note.png') 10px 50% no-repeat;
}

span.cart {
  color: #666;
  border: 1px solid #C5C5C5;
  background: #E6E6E6 url('../webpage_files/typo/cart.png') 10px 50% no-repeat;
}

span.camera {
  color: #666;
  border: 1px solid #C5C5C5;
  background: #E6E6E6 url('../webpage_files/typo/camera.png') 10px 50% no-repeat;
}

span.doc {
  color: #C76E34;
  border: 1px solid #FFBB65;
  background: #FFE0B6 url('../webpage_files/typo/doc.png') 10px 50% no-repeat;
}

span.attention a,
span.notice a,
span.alert a,
span.download a,
span.approved a,
span.media a,
span.note a,
span.cart a,
span.camera a,
span.doc a {
  color: #666;
}