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

/* addon classes */
.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;

}

h1, #content article.blog>h1 {font-size:1.75em; line-height: 1em; margin-bottom:1em; font-weight: 300; color:#f14c38;line-height: 120%;}
#content>section {margin:1em 0}
h1 span {display: block; color: #202020; font-size: 1.4375rem; font-style: italic;}
h1 span.information {font-size:1.0625rem;}
h1 span.information strong {color:#000;}
h2, #content * h1 {font-size:1.6em; font-weight: 300; color:#f14c38; line-height: 120%;}
h2 em {font-size:0.5em}
h3 {font-size:1.5em; margin-bottom: .5em; font-weight: 300; color:#f14c38;line-height: 120%;}
h4, th{font-size:1.4em; margin-bottom: .5em; color: #000; font-style: italic;line-height: 120%;}
h5 {font-size:1.3em; font-weight: 300; color:#f14c38;line-height: 120%;}
h6 {font-size:1.2em; font-weight: 700; font-style: italic;line-height: 120%;}
h7 {font-size:1.1em; font-weight: 300; color:#f14c38;line-height: 120%;}
h8 {font-size:1em;line-height: 120%;}
h9 {font-size:1em; font-weight: 300; color:#f14c38;line-height: 120%;}

/* list */
.content ul li {padding-left: 1.5em;}
/* forms */
.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}

button, .button, input[type="button"], input[type="submit"], input[type="reset"], .linkButton {line-height:180%}
.formTable td:first-child {padding: 0}

/* nav */
header {background: rgba(5, 75, 129, 0.95); text-align: center}
header > .wrap > a {display: block; width:50%; float: left}
header > .wrap > a+a {border-left: 1px solid rgba(255, 255, 255, 0.2)}
header > .wrap > a img {max-width:6em; height: auto; display: inline-block; vertical-align: middle}
header > .wrap > a:before {content: ''; height: 3.5em; display: inline-block; vertical-align: middle}
#mainnav{position: fixed;left: 100%;top:0;bottom:0;width: 75%;background-color:#f14c38; text-align: left; z-index:100; transition: ease all 200ms; overflow-y: scroll}
.slideNav #mainnav{left: 25%; box-shadow: 0 0 0 100em rgba(0,0,0,0.85)}
#mainnav aside.menu:before {content: "\2715"; background:#fff; color: #f14c38; width:1em; height:1em; line-height:1em; display:inline-block; text-align:center; border-radius: 50%; margin-right:0.35em}
#mainnav nav{display: inline}
#mainnav ul{display: block;float: left;width: 100%;margin: 0;padding-left: 0}
#mainnav li{display:block;float: left; border-top: 1px solid rgba(255,255,255,0.15); width: 100%; position: relative}
#mainnav a, #mainnav .menu{color:#fff; font-size:1em;line-height:2.5em;padding:0 1rem;display:block;float: left;width: 100%}
#mainnav a:hover,#mainnav .menu:hover,
#mainnav li.on
	{background-color:rgba(5, 75, 129, 0.95); color: #fff}
#mainnav li.open{background-color: rgba(0,0,0,0.25)}
#mainnav li>span{color: #000;background-color:#fff;opacity: .5; border-radius: 50%; display: block;position: absolute;right: .25em;top: .25em;line-height: 1.5em;width:1.5em;text-align: center;
-webkit-transition: transform .2s ease;transition: transform .2s ease}
#mainnav li>span:hover, #mainnav li.on>span{opacity: .3}
#mainnav li>span:before{content: "\25B8"}
#mainnav li.open>span{transform: rotate(90deg)}
#mainnav ul ul {font-size: .8em; background: rgba(0,0,0,0.15)}
#mainnav li.on ul {display: block !important}
#mainnav ul ul a {padding: 0.5rem 1rem 0.5rem 2rem; line-height:130%}
#mainnav ul ul a:hover {background: rgba(0,0,0,0.25)}

#mobilenav{background-color: #f14c38;width: 100%;text-align: center; display:table;}
#mobilenav a, #mobilenav span{width: 20%; display: table-cell; font-size: 0.9em; line-height: 2.5rem; color: #fff}
#mobilenav a:hover, #mobilenav span:hover{color: #fff;background-color:#054b81}
#mobilenav span:before {content: url(/images/m/menu.svg); display: inline-block; width:1em; height:1em; vertical-align:sub; margin-right:0.75em}
.hamburger{height: 2.5em;width: 2.5em;display: block;position: fixed;right: 0;top:0;opacity: .5;background:#333 url(/images/m/menu.svg) no-repeat center;z-index:1;opacity: 0}
.hamburger.on{opacity: .5}

/* content */
.photoright, .photoleft{margin:1em 0; width: 100%}
#content img {max-width: 100%; height: auto}
figcaption {font-size: 0.8em; font-style: italic; color:#666}
.home main {float: left; clear: both; width:100%; padding: 0 1em 1em; text-align: center}
.home main h1 {color: #767676}
.home main h1:after {background: #e8e8e8 none repeat scroll 0 0; content: ""; display: block; height: 1px; margin: 1.2em auto; padding: 0; width: 65%;}
.home main p {margin-bottom: 3em}
#sidenav {background:#ececec; padding:1em; border-radius: 0.25em; margin: 3em 0 2em}
#sidenav > ul > li.on > a {display: none}
#sidenav ul li {border-bottom: 1px solid #ccc}
#sidenav ul li:last-child, #sidenav ul ul li.on {border-bottom: 0}
#sidenav ul li a {display: block; padding:0.5em; line-height: 120%}
#sidenav ul ul li.on a {background: #f14c38; color:#fff}

main>div>aside>a {display: block; margin-top: 1em; padding-top: 1em; border-top:1px solid #dbdbdb; text-align: center;}
main>div>aside>a h1 {margin:0 0 .75em 0; font-size:1.25em; line-height: 1.3em; color: #000; font-style: italic;}
main>div>aside>a p {margin:0}
main>div>aside>a span {background: #f14c38; color: #fff; font-size: 1em; font-style: italic; text-align: center; display: block; padding: .625em 0 .75em;}
main>div>aside>a img {width:100% !important; height: auto !important}

.projects #content > a {width: 100%; display: block; vertical-align: top; margin: 0 0 4em}
.projects #content > a > div {width: 100%; height: 0; padding-bottom: 100%; margin-bottom: 1.25em; display: block; background-size:cover; background-position:center; background-repeat:no-repeat}

.projects #content > a {background: #054b81; margin-bottom: 3.75%; position: relative}
.projects #content > a > div {margin-bottom: 0}
.projects #content > a:hover > div {opacity:0.5; -webkit-opacity:0.5}
.projects #content > a > span {font-size:1.25em; position: absolute; bottom:0; left:0; width: 100%; line-height: 130%; padding:.8em 1em; font-weight: 100; text-align:center; display:block; color:#fff; background: #f14c38; z-index: 10;}
.projects #content > a:hover > span {background: #054b81;}


/* main */
main{padding-left: 1rem; padding-right: 1rem}
main .wrap {padding: 2em 0}

/* footer */
body>footer {width:100%; float: left; clear: both}
body>footer .wrap{border-top: 1px solid #dbdbdb; font-size: 0.7em; line-height: 160%; padding:1rem;}
body>footer .wrap nav{display: inline-block}
body>footer #web-solutions-exposure {display: none}