@charset "UTF-8";
/* Web Solutions 4.0 Compatible */

body.slideNav {overflow: hidden;}

/* HEADINGS ------------------------------ */
h1 { font-size: 2.25em; }
h2 { font-size: 1.375em; }
h3 { font-size: 1.25em; }
h4, th { font-size: 1.125em; }
h5 { font-size: 1.0625em; }
h6 { font-size: 1.0625em; }
.intro, p.intro { font-size: 1.125em; }


/* HEADER ------------------------------ */
body { padding-top: 0 !important; }
body>header { position: static !important; background: #FFF}
body>header>.wrap { padding-left: 0 !important; padding-right: 0 !important; }

body>header:before{content: "";opacity: 0; z-index: 3;background-color: #fff;display: block;position: fixed;left:100vw;top:0;width:100vw;height:100vh;-webkit-transition:left 0ms ease 200ms, opacity 200ms ease;-o-transition:left 0ms ease 200ms, opacity 200ms ease;transition:left 0ms ease 200ms, opacity 200ms ease}
body.slideNav>header:before{left:0;opacity: .85;-webkit-transition:left 0ms ease 0ms, opacity 200ms ease;-o-transition:left 0ms ease 0ms, opacity 200ms ease;transition:left 0ms ease 0ms, opacity 200ms ease}
body>header #brand {display: block;padding: 1.25em 1.5em;}
body>header #brand img {max-width: 23em;width:100%;height: auto;display: block;margin: 0 auto;}
body>header #navContainer{position: fixed;left: 100%;top:0;bottom:0;width: 75%;max-height: 100vh;background-color: #023A54;z-index:4;-webkit-transition: left 200ms ease;-o-transition: left 200ms ease;transition: left 200ms ease;overflow:auto;-webkit-overflow-scrolling: touch;}
body.management>header #navContainer { top: 2.25em }
body.slideNav #navContainer{left: 25%;}
body>header #navContainer nav{display: inline}
body>header #navContainer ul{display: block;float: left;width: 100%;margin: 0;padding-left: 0}
body>header #navContainer li {display:block;float: left;width: 100%; position: relative; border-top: 1px solid rgba(255,255,255,0.125)}
body>header #navContainer li li {border: 0}
body>header #navContainer a, #navContainer .menu{color: #FFF;line-height:2.75em;padding:0 1rem;display:block;float: left;width: 100%;}
#navContainer .menu span { font-size: 1.625em; line-height: 1; margin: 0 .125em 0 0; position: relative; top: .125em;}
body>header #navContainer li>a:hover, body>header #navContainer li.on a:hover {background-color: rgba(255,255,255,.1);color: #fff;}
#navContainer .menu:hover, body>header #navContainer li.on a{background-color: rgba(255,255,255,.05);color: #fff;}
body>header #navContainer li.open{background-color: rgba(255,255,255,.05);}
body>header #navContainer li>span{display: block;position: absolute;right: 0;top: 0;width:2.75em;height: 2.75em;}
body>header #navContainer li>span:before{content: "";display: block;width: 50%;height: 0.1rem;background-color: #FFF;position: absolute;left: 50%;top: 50%;-webkit-transform: translate(-50%, -50%) rotate(90deg);-ms-transform: translate(-50%, -50%) rotate(90deg);transform: translate(-50%, -50%) rotate(90deg);-webkit-transform-origin: center center;-ms-transform-origin: center center;transform-origin: center center;}
body>header #navContainer li>span:after{content: "";display: block;width: 50%;height: 0.1rem;background-color: #FFF;position: absolute;left: 50%;top: 50%;-webkit-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);transform: translate(-50%, -50%);-webkit-transform-origin: center center;-ms-transform-origin: center center;transform-origin: center center;}
body>header #navContainer li.open > span:before {-webkit-transform: translate(-50%, -50%)rotate(0deg);-ms-transform: translate(-50%, -50%)rotate(0deg);transform: translate(-50%, -50%)rotate(0deg);}
body>header #navContainer li > span::before { -webkit-transition: -webkit-transform .2s ease; transition: -webkit-transform .2s ease; -o-transition: transform .2s ease; transition: transform .2s ease; transition: transform .2s ease, -webkit-transform .2s ease;}
body>header #navContainer ul ul {font-size: .8em;display: none}
body>header #navContainer ul ul a {padding-left: 2rem}
body>header #navContainer ul ul li.on a {background-color: rgba(255,255,255,.05);}
body>header #navContainer #ancillary {clear:both;display: block;}
body>header #navContainer #ancillary .search {clear:both; display: block; overflow: auto; padding:1rem; border-top: 1px solid rgba(255,255,255,0.125)}
body>header #navContainer #ancillary .search input {float: left;}
body>header #navContainer #ancillary .search input[type="text"] {width: -webkit-calc(100% - 5rem);width: calc(100% - 5rem)}
body>header #navContainer #ancillary .search input[type="submit"] {width: 5rem;}
/* mobilenav */
body>header #mobilenav{background-color: #D8D8D8;width: 100%;text-align: center;display: -ms-flexbox;display: -webkit-box;display: -webkit-flex;display: flex;-ms-flex-direction: row;-webkit-box-orient: horizontal;-webkit-box-direction: normal;-webkit-flex-direction: row;flex-direction: row;-ms-flex-wrap: nowrap;-webkit-flex-wrap: nowrap;flex-wrap: nowrap;-ms-flex-pack: center;-webkit-box-pack: center;-webkit-justify-content: center;justify-content: center;-ms-flex-line-pack: center;-webkit-align-content: center;align-content: center;-ms-flex-align: center;-webkit-box-align: center;-webkit-align-items: center;align-items: center;}
#mobilenav span svg {height: 1em;pointer-events: none;position: relative;top: .1875em;width: 1em;}
#mobilenav span svg path {fill: #2F2F2F;}
body>header #mobilenav a, #mobilenav span{color: #2F2F2F;line-height: 2.5;-ms-flex-order: 0;-webkit-box-ordinal-group: 1;-webkit-order: 0;order: 0;-ms-flex: 1 1 auto;-webkit-box-flex: 1;-webkit-flex: 1 1 auto;flex: 1 1 auto;-webkit-align-self: auto;-ms-flex-item-align: auto;align-self: auto;}
body>header #mobilenav *+* {border-left: 1px solid rgba(255,255,255,0.25)}
body>header #mobilenav a:hover, #mobilenav span:hover{color: #fff;background-color: #023A54;}
#mobilenav span:hover svg path { fill: #FFF; }
/* hamburger */
body>header .hamburger{height: 2em;width: 2em;border-radius: 4px; display: block;position: fixed;right: 3px;top:3px;z-index:2;opacity: 0;background-color: #037A8B;padding: 1px 3px 3px 3px;}
body.management>header .hamburger { top: 2.5em; }
body>header .hamburger path {fill: #FFF;}
body>header .hamburger svg {height: 75%;left: 50%;pointer-events: none;position: absolute;top: 50%;-webkit-transform: translate(-50%,-50%);-ms-transform: translate(-50%,-50%);transform: translate(-50%,-50%);width: 75%;}
body>header .hamburger.on{opacity: 1;}

/* MAIN ------------------------------ */
.twoCol, .threeCol, .resCol{
  -webkit-column-rule:1px outset rgba(0,0,0,.15);
  -moz-column-rule:1px outset rgba(0,0,0,.15);
  column-rule:1px outset rgba(0,0,0,.15);
  -webkit-columns: auto;
  -moz-columns: auto;
  columns: auto;
  -webkit-column-width: 13em;
  -moz-column-width: 13em;
  column-width: 13em;
}

.content ul li {padding-left: 1.5em;}
.formTable, .formTable table{width:100%;display: block}
.formTable tbody{display: block}
.formTable tr{display: block}
.formTable td{display: block;width:100%;padding: 0}
.formTable input[type="text"], .formTable input[type="password"], .formTable input[type="tel"], .formTable input[type="number"], .formTable input[type="email"], .formTable input[type="url"], .formTable textarea{margin-bottom:1em}
.formTable table td + td {padding-left: 0 !important;}

.manage.rightFirstChild td:first-child { text-align: left; }
.manage td, .manage th { display: block; }

.content .photoright,
.content .photoleft {max-width:100%; float:none; width:100%; margin:0 0 1em;}
.content figcaption {text-align: center;}
.content p:empty {display: none}
.content img {max-width: 100%; height:auto}

.content .icon-links li {width:50%}

blockquote {
  float: none;
  margin: 1em 0 1em;
  max-width: 100%;
  text-align: right;
  width: 100%
}

.content ul li:before { left: .75em; }
main>div>#content { padding: 2em 0 3em;}

.content .flex-images {margin: 0 0 2rem;}
.content .flex-images > figure {margin: 0}
.content .flex-images > figure + figure {margin-top: 1.5em}
.content .flex-images > figure img {max-width: 100%; margin:0 auto 0.5em; display: block; height: auto}
.content .flex-images > figure figcaption {text-align: center; line-height:1.25em}


/* FOOTER ------------------------------ */
body>footer {background-position: center bottom;background-size: 90% auto;font-size: .9375rem;padding: 2.5em 0 2.25em;}
body>footer .wrap{display: -ms-flexbox;display: -webkit-box;display: -webkit-flex;display: flex;-ms-flex-direction: column;-webkit-box-orient: vertical;-webkit-box-direction: normal;-webkit-flex-direction: column;flex-direction: column;-ms-flex-wrap: nowrap;-webkit-flex-wrap: nowrap;flex-wrap: nowrap;-ms-flex-pack: start;-webkit-box-pack: start;-webkit-justify-content: flex-start;justify-content: flex-start;-ms-flex-line-pack: stretch;-webkit-align-content: stretch;align-content: stretch;-ms-flex-align: stretch;-webkit-box-align: stretch;-webkit-align-items: stretch;align-items: stretch;}
#web-solutions{-ms-flex-order: 1;-webkit-box-ordinal-group: 2;-webkit-order: 1;order: 1;}
body>footer .wrap nav a+span:before {content: "|"; margin: 0 0.5em}

/* MOBILE SIZING ------------------------------ */
#hero { font-size: .625rem; }
#callouts, #history, .text-section, main.interior { font-size: .875rem; }
#sidenav { font-size: 1rem; }

/* HERO ------------------------------ */
#hero::after {background:rgba(255,255,255,0.75)}
#hero .wrap { top: 50%; left:0; width:100%; transform: translateY(-50%); text-align:center}
#hero .textbox {margin: 0 auto}
#hero .button { font-size: .875rem; }

/* CALLOUTS ------------------------------ */
#callouts { padding: 3.5em 0 1.5em; }
#callouts li { width: -webkit-calc(50% - .75em); width: calc(50% - .75em); }

#callouts li:nth-child(1n) a { -webkit-transition-delay: 0s; -o-transition-delay: 0s; transition-delay: 0s; }
#callouts li:nth-child(2n+2) a { -webkit-transition-delay: .2s; -o-transition-delay: .2s; transition-delay: .2s; }

/* HISTORY ------------------------------ */
#history .wrap { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -webkit-flex-direction: column-reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; overflow: visible; }
#history .textbox { -webkit-transition-delay: 0s; -o-transition-delay: 0s; transition-delay: 0s; width: 100%; }
#history h2 { font-size: 2em; }
#history img { margin: 2em auto 0; max-width: 470px; width: 100%; }


/* WELCOME / CALL-TO-ACTION ------------------------------ */
.text-section {padding: 3.5em 0;}
.text-section h1 { font-size: 2em; }


/* MEDIA QUERIES ------------------------------ */

@media (max-width: 500px) {
  #hero { font-size: .5rem; }
  #callouts, #history, .text-section { font-size: .8125rem; }

  #callouts li { margin: 0 auto; max-width: 25em; width: 100%; }
  #callouts li:nth-child(1n) a { -webkit-transition-delay: 0s; -o-transition-delay: 0s; transition-delay: 0s; }

  #history h2, .text-section h1 { font-size: 1.875em; }
  #history p, .text-section p { font-size: 1rem; }

}

/* -------======= STYLE-M.CSS =======------- */
