@charset "UTF-8";
/*------------------------------------------------------------------------------
Useful Mixins
------------------------------------------------------------------------------ */
/*
 * Create a centered isosceles triangle.
 */
/*------------------------------------------------------------------------------
CLEAR THE DECKS
------------------------------------------------------------------------------ */
* {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  vertical-align: baseline;
  text-decoration: none;
}

body {
  line-height: 1;
  /* set line-height multiplier to be used with font size*/
}

ol, ul {
  list-style: none;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
  border-collapse: separate;
  border-spacing: 0;
}

caption, th, td {
  text-align: left;
  font-weight: normal;
}

q {
  quotes: "“" "”" "‘" "’";
}

blockquote:before, q:before {
  content: open-quote;
}

blockquote:after, q:after {
  content: close-quote;
}

ol li {
  list-style-type: decimal;
  margin-left: 25px;
}

ul li {
  list-style-type: disc;
  margin-left: 20px;
}

sup {
  vertical-align: super;
  font-size: smaller;
}

sub {
  vertical-align: sub;
  font-size: smaller;
}

div, aside, nav, header, section, footer {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/*--------------
Instead of floats (doesn't collapse the parent like floats)
display: inline-block;
margin-left: -4px; or PREFERRED: set parent to font-size: 0 or display: inline-table
vertical-align: top;
----------------*/
/*------------------------------------------------------------------------------
SITE COLORS FOR REFERENCE
------------------------------------------------------------------------------*/
/*
$gold: #d0b861;
$light-gold: #f8f4c6;
$dark-gold: #bd9e2f;
$gray: #767d84;


 isomount:
 font-family: "Montserrat", sans-serif;
 font-optical-sizing: auto;
 font-weight: 300;
 font-style: normal;

 font-family: "Barlow Semi Condensed", sans-serif;
 font-weight: 600;
 font-style: normal;
*/
/*------------------------------------------------------------------------------
WEB.FONTS
------------------------------------------------------------------------------*/
h1, h2, h3, h4, h5, h6 {
    font-family: "Barlow Semi Condensed", sans-serif;
    font-weight: 600;
    font-style: normal;
}

p, li, td, label {
    font-family: "Montserrat", sans-serif;
    font-optical-sizing: auto;
    font-weight: 300;
    font-style: normal;
}

i, em, caption {
    font-family: "Montserrat", sans-serif;
    font-optical-sizing: auto;
    font-weight: 300;
    font-style: normal;
}

b, strong {
    font-family: "Montserrat", sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
}

/*------------------------------------------------------------------------------
Basic Highsite Styles and Variables
------------------------------------------------------------------------------*/
/*------------------------------------------------------------------------------
HIGHSITE HTML PREFERENCES
------------------------------------------------------------------------------*/

h1, h2, h3, h4, h5, h6, p {
  margin-bottom: .1em;
}

/* h1, h2, h3 { letter-spacing: -.05em; } */
h1, h2, h3, h4, h5, h6 {
  word-spacing: 0.25px;
  color: #233871;
}

h1, h2, h3 {
  line-height: 1.10em;
}

h4, h5, h6 {
  line-height: 1.25em;
}

p, a, li, td, label {
  line-height: 1.5em;
  color: #555555;
}

/* initial sizes—use /xm_client/editor.css for special TinyMCE editor styling*/
h1 {
  font-size: 2.0em;
  margin-top: 1em;
}

.subpage h1 {
  font-size: 3.0em;
  color: #e14727;
  text-align: center;
  letter-spacing: -0.01em;
  margin-top: 1em;
}

h2 {
  font-size: 3.0em;
  color: #e14727;
  text-align: center;
  letter-spacing: -0.01em;
  margin-top: 1em;
  margin-bottom: .3em;
}

h3 {
  font-size: 1.8em;
  margin-top: .6em;
  margin-bottom: .2em;
}

h4 {
  font-size: 1.8em;
  color: #e14727;
  margin-top: .6em;
}

h5 {
  font-size: 1.4em;
  margin-top: .3em;
}

h6 {
  font-size: 1.2em;
  margin-top: .3em;
}

p, td {
  font-size: 100%;
}

a, i, em, b, strong, span, li, q {
  color: inherit;
  font-size: inherit;
  font-family: inherit;
  font-weight: inherit;
}

a:link, a:visited {
  color: #e14727;
}
a:hover {
  color: #cccccc;
}

/*------------------------------------------------------------------------------
STICKY FOOTER
--------------------------------------------------------------------------------*/
/*
    OR
*/
/*------------------------------------------------------------------------------
FOOTER
--------------------------------------------------------------------------------*/
footer {
  position: relative;
  height: 260px;
  /* same as footer height */
  clear: both;
  color: black;
  background: none;
  /*url(/xm_client/images/footer-trade-bar.jpg) repeat-x top */
  margin: 50px 0 0 0;
  /* width is 100% because footer is a block element */
}
footer p {
  text-align: center;
}
footer .content {
  position: relative;
  margin: 0 auto;
  width: 100%;
  overflow: auto;
}

/* Use this to set the styling in the TinyMCE footer editor to match the actual footer */
/*------------------------------------------------------------------------------
SITE-WIDE BODY & DIVS
------------------------------------------------------------------------------*/
.container {
  position: relative;
  margin: 0 auto;
  width: 100%;
  max-width: 1000px;
  /* remove if adding clearfix for the absolutely positioned element */
}

/* Add this class to container and remove overflow:auto
   for absolutely positioned element
.cf:before, .cf:after {
    content: " ";
    display: table;
}
.cf:after {
    clear: both;
}
*/
.utility {
  float: right;
  width: 800px;
  height: 30px;
  margin: 5px 0 0 0;
}
.utility ul {
  float: left;
  margin: 0 0 0 100px;
}
.utility li {
  float: left;
  list-style: none;
  padding: 9px 20px 0 0;
}
.utility input {
  width: 200px;
}
.utility .search {
  margin: 10px 0 0 0;
  width: 200px;
  height: 15px;
  border: 1px dotted;
}
.utility a img.startsearch {
  vertical-align: -5px;
}

/*------------------------------------------------------------------------------
DIVS -- HOME
------------------------------------------------------------------------------*/
header, .container, nav {
  width: 100%;
  max-width: 1000px;
  min-height: 20px;
  margin: 0 auto;
}

.container {
  position: inherit;
}
@media (max-width: 400px) {
  .container img {
    max-width: 100% !important;
    height: auto;
  }
}

.logo {
  float: left;
  width: 300px;
  margin: 20px 0 0 0;
}
@media (max-width: 1020px) {
  .logo {
    margin: 20px 0 0 20px;
  }
}
@media (max-width: 500px) {
  .logo {
    width: 250px;
  }
}
@media (max-width: 350px) {
  .logo {
    width: 190px;
    margin: 20px 0 0 10px;
  }
}

#hero {
  width: 100%;
  max-width: 725px;
  margin: 0 auto;
}
#hero img {
  width: 100%;
}
@media (max-width: 320px) {
  #hero img {
    margin-top: 10px;
  }
}

#intro {
  width: 100%;
  max-width: 600px;
  padding: 0px 20px 50px;
  margin: 0 auto;
}

.applications {
  width: 100%;
  display: inline-block;
}
.applications #applications {
  height: auto;
  background: #e7e9ed;
  padding: 10px 0 30px 0;
}
@media (max-width: 400px) {
  .applications #applications img {
    max-width: 100% !important;
    height: auto;
  }
}

#features {
  height: auto;
  width: 100%;
  max-width: 775px;
  margin: 0 auto;
}
#features .feature1, #features .feature2, #features .feature3, #features .feature4 {
  width: 49%;
  display: inline-block;
}
#features .feature1, #features .feature3 {
  padding: 0 15px 0 30px;
}
#features .feature2, #features .feature4 {
  padding: 0 30px 0 15px;
}
@media (max-width: 775px) {
  #features .feature1, #features .feature2, #features .feature3, #features .feature4 {
    width: 100%;
    padding: 20px 50px;
  }
}

table {
  max-width: 775px;
  margin: 0 auto;
}
table td {
  vertical-align: top;
  padding: 0 30px 30px 30px;
}
@media (max-width: 775px) {
  table td {
    display: block;
    padding: 0 15px 30px 15px;
  }
}

address {
  width: 200px;
  margin: 20px 0 20px 0;
}

/*------------------------------------------------------------------------------
DIVS -- SUB--TWO COL
------------------------------------------------------------------------------*/
.subpage header {
  height: 140px;
}
@media (max-width: 400px) {
  .subpage header {
    height: 100px;
  }
}
.subpage #intro {
  width: 100%;
  max-width: 1000px;
  /*to shorten paragraph to not flow beyond specs chart*/
}
.subpage #intro table {
  max-width: 850px;
}
@media (max-width: 850px) {
  .subpage #intro table td {
    display: block;
  }
}
.subpage #intro img {
  max-width: 100% !important;
  height: auto;
}
.subpage #intro p {
  max-width: 800px;
}

/*------------------------------------------------------------------------------
DIVS -- ORDER
------------------------------------------------------------------------------*/
#order table {
  margin: 0;
  border-top: 1px solid #bbb;
  border-bottom: 1px solid #bbb;
}

#order th, #order td {
  padding: 6px 10px;
  width: 100px;
}
@media (max-width: 750px) {
  #order th, #order td {
    width: 300px;
  }
}

#order table.details {
  border-top: none;
  border-bottom: none;
}

#order table.details td {
  padding: 0 10px;
  width: 180px;
}

#order td input[type=text] {
  width: 60px;
}

/*------------------------------------------------------------------------------
HORIZONTAL MENU
------------------------------------------------------------------------------*/
/*CONTROLS ALL LISTS*/
nav {
  /*position or float*/
  width: 50%;
  padding: 12px;
  max-width: 1000px;
  height: 29px;
  display: block;
  position: relative;
  float: right;
}
@media (max-width: 670px) {
  nav {
    width: 100px;
  }
}
nav #menuh {
  float: right;
  display: inline;
  list-style: none;
  /*----- BELOW THREE DIVS CONTROL ALL LIST ITEMS -----*/
  /*CONTROLS SECOND-LEVEL LIST ITEMS OR FLY-DOWNS*/
}
nav #menuh li {
  float: left;
  margin: 0;
  list-style: none;
}
@media (max-width: 670px) {
  nav #menuh li {
    float: none;
    text-align: right;
  }
}
nav #menuh li a {
  display: block;
  font-size: 20px;
  font-family: "Barlow Semi Condensed", sans-serif;
  font-weight: 600;
  font-style: normal;
  line-height: 16px;
  /*set vert spacing between li's and the main UL... */
  text-transform: uppercase;
  /*...from the top of the nav div and the top of the... */
  letter-spacing: .05em;
  /*...flydown from bottom of the top ul, and left and right... */
  color: #e14727;
  /*...distances between edges of type and left of li */
  text-decoration: none;
  padding: 7px 15px 6px 10px;
}
@media (max-width: 400px) {
  nav #menuh li a {
    padding: 7px 0 6px 10px;
  }
}
nav #menuh li a:hover {
  color: #cccccc;
}
nav #menuh li a .current_top_menu_item {
  color: #e14727;
}
nav #menuh ul {
  float: left;
  padding: 0;
  list-style: none;
  width: 180px;
  /* can be anything AFAIK, but it has to be there*/
  left: -999em;
  position: absolute;
}
nav #menuh ul li {
  float: left;
  margin: 0;
  padding: 0;
  /*CONTROLS THIRD-AND ABOVE LEVEL LIST ITEMS*/
}
nav #menuh ul li a {
  display: block;
  padding: 3px 30px 3px 10px;
  background-color: none;
  width: 140px;
  /* master width minus left & right padding */
  border-top: 1px solid #fff;
}
nav #menuh ul li a:hover {
  color: #cccccc;
  background-color: none;
}
nav #menuh ul li ul {
  position: absolute;
  margin: 0 0 0 0;
  padding: 0;
  left: -999em;
  z-index: 1;
}
nav #menuh ul li ul li ul {
  margin: -22px 0 0 180px;
  /* the -top px vertically positions the right flyout */
  /*...and the left margin is ul-li-a horiz spacing+width+1/0 */
}
nav #menuh ul li ul li ul li a {
  background-color: none;
}
nav #menuh ul li ul li ul li a:hover {
  color: #cccccc;
  background-color: none;
}

/* lists nested under hovered list items */
#menuh li:hover ul ul, #menuh li:hover ul ul ul, #menuh li:hover ul ul ul ul {
  left: -999em;
}

#menuh li:hover ul, #menuh li li:hover ul, #menuh li li li:hover ul, #menuh li li li li:hover ul {
  left: auto;
}

.home nav {
  margin: 0 0 0 0;
}

.subpage nav {
  margin: 14px 0 0 0;
}

/*------------------------------------------------------------------------------
FOOTER MENU
------------------------------------------------------------------------------*/
/* ----- footer menu --- */
.footer_menu {
  float: left;
  min-height: 100px;
  width: 850px;
  margin: 30px 0 0 0;
}

.menu2 {
  display: inline;
  width: 850px;
}
.menu2 li {
  float: left;
  margin: 0;
  list-style: none;
}
.menu2 li.top a {
  text-transform: uppercase;
  color: #555555;
  font-weight: bold;
}
.menu2 li a {
  display: block;
  font-size: 13px;
  line-height: 18px;
}
.menu2 li a:hover {
  color: #aaaaaa;
}
.menu2 li ul {
  position: relative;
  left: 0;
  list-style: none;
}
.menu2 ul {
  float: left;
  margin: 0;
  padding: 0;
  width: 140px;
}
.menu2 ul li a {
  display: block;
  text-transform: capitalize !important;
  text-align: left;
  padding: 0;
  width: 100px;
  line-height: 15px;
  margin: 5px 0 0 0;
  font-weight: normal !important;
}
.menu2 ul li a:hover {
  color: #999999;
}

/*------------------------------------------------------------------------------
HIGHSITE ONLY -- keep at end of file
------------------------------------------------------------------------------*/
.error_page h1 {
  margin: 40px 0 10px 40px;
}

.error_page p {
  margin: 10px 40px;
}

p.edit_link_block {
  background: none;
}

p.edit_link_block a.edit_link {
  color: #9a4446;
  font-weight: normal;
  font-size: 9px;
  text-decoration: none;
  text-shadow: 0px 8px 0px white;
}

p.edit_link_block a.edit_link:hover {
  text-decoration: underline;
}

.multidiv {
  /* for separating multiple sections */
  position: relative;
  margin: 0 0 20px 0;
  border-bottom: 2px dotted #999;
  padding-bottom: 20px;
}

/*------------------------------------------------------------------------------
Forms
------------------------------------------------------------------------------*/
#public_form textarea, #order textarea {
  width: 280px;
}
#public_form .blabel, #order .blabel {
  font-family: "Barlow Semi Condensed", sans-serif;
  font-weight: 600;
  font-style: normal;
  color: #0c395b;
}
#public_form a.button, #public_form a.small_button, #public_form input.button, #public_form input.small_button, #order a.button, #order a.small_button, #order input.button, #order input.small_button {
  background: #e24727;
  border-top: none;
  border-bottom: none;
  font-family: "Montserrat", sans-serif;
  font-optical-sizing: auto;
  font-weight: 300;
  font-style: normal;
  color: #ffffff;
}
#public_form a.small_button:link, #public_form a.small_button:hover, #order a.small_button:link, #order a.small_button:hover {
  color: #fff;
}
#public_form p.wrap, #public_form textarea, #public_form input, #public_form .label, #order p.wrap, #order textarea, #order input, #order .label {
    font-family: "Montserrat", sans-serif;
    font-optical-sizing: auto;
    font-weight: 300;
    font-style: normal;
}
#public_form a.small_button, #order a.small_button {
  padding: 4px 8px 5px 8px;
}
#public_form p.total, #order p.total {
  margin: 6px 0 20px;
  font-family: "Barlow Semi Condensed", sans-serif;
  font-weight: 600;
  font-style: normal;
}
#public_form p.wrap > span, #order p.wrap > span {
  color: #c00;
  font-size: 1.5em;
  font-family: "Barlow Semi Condensed", sans-serif;
  font-weight: 600;
  font-style: normal;
}
#public_form a.reset.submit, #order a.reset.submit {
  margin-left: 20px;
}

.form.order {
  margin-left: 18px;
}

.subpage #intro form#public_form {
  width: 300px;
  margin: 0 auto;
}

/*------------------------------------------------------------------------------
INSTA-SEARCH
------------------------------------------------------------------------------*/
#is_search {
  display: inline-block;
}

#search_response {
  box-shadow: 0 0  10px #bbb;
}
#search_response li p {
  font-size: 15px;
  line-height: 20px;
}
#search_response li h5 {
  font-size: 16px;
}
#search_response li h3 {
  font-size: 18px;
}

input#is_search_text {
  width: 200px;
  height: 20px;
}

/* add to head jQuery
$('input[type=submit]').addClass('button');
$('input[type=submit]').val('Go');
*/
/*------------------------------------------------------------------------------
BLOG
------------------------------------------------------------------------------*/
.blog .container {
  position: relative;
  margin: 0 auto;
  width: 960px;
  padding-bottom: 40px;
  background: #fff;
  overflow: hidden;
}
.blog section#intro {
  height: 120px;
  margin: 0 0 20px 0;
}
.blog section#intro header {
  position: relative;
  top: -6px;
  /* edit */
  left: 80px;
  font-family: "futura-pt";
  font-size: 60px;
  color: #00326d;
  letter-spacing: .3em;
}
.blog section#intro header span {
  color: #bbb;
}
.blog section#intro header span + span {
  color: #629b00;
}
.blog section#intro .logo {
  top: -18px;
  left: 80px;
}
.blog section#intro ul#menuh {
  top: -10px;
  right: 50px;
}
.blog .left_column {
  float: left;
  width: 620px;
  margin: 0 0 0 80px;
  /* padding-bottom: 80px; */
}
.blog .left_column p {
  color: #777;
  font-family: "kepler-std-semicondensed";
  font-size: 18px;
  margin-bottom: 6px;
}
.blog .left_column h1 {
  font-family: "kepler-std-semicondensed";
  font-size: 30px;
  margin: 15px 0 20px 0;
  letter-spacing: 0em;
  color: #6A7C8A;
  line-height: 1.0em;
}
.blog .left_column h3 {
  margin: 12px 0 6px 0;
}
.blog .left_column ul, .blog .left_column ol {
  margin: 0 0 12px 20px;
}
.blog .right_column {
  float: left;
  width: 230px;
  margin: 0 0 0 50px;
  /* padding-bottom: 80px; */
}
.blog .right_column img {
  margin-bottom: 40px;
  width: 220px;
}
.blog .listings {
  margin-bottom: 40px;
  width: 220px;
}
.blog .listings h6 {
  font-size: 18px;
  font-family: "futura-pt";
  font-weight: normal;
  letter-spacing: .1em;
  color: #00326d;
}
.blog .listings p.category {
  font-weight: bold;
  margin: 5px 0 0 0;
  color: #777;
  cursor: pointer;
}
.blog .listings ul {
  list-style: none;
  margin-bottom: 10px;
}
.blog .listings ul li {
  margin: 0 0 8px 0;
}
.blog .listings p.category + ul {
  display: none;
  margin-bottom: 5px;
  margin-left: 15px;
}
.blog .listings p.category + ul {
  display: none;
  margin-bottom: 5px;
  margin-left: 15px;
}
.blog .listings h6 + ul {
  margin-left: 0px;
  margin-top: 5px;
}
.blog .arrows {
  font-size: 12px;
  color: #ccc;
  cursor: pointer;
}
.blog #disqus_thread {
  float: left;
  width: 620px;
  margin: 20px 0;
}
.blog .meta {
  display: none;
  /* at least for this site */
  background: beige;
  padding: 5px 12px;
  -webkit-border-radius: 8px;
  border-radius: 8px;
}
.blog .meta p {
  font: 12px/18px Verdana;
}