@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);
}

.twoCol {-webkit-columns:2;-moz-columns:2;columns:2;}
.threeCol {-webkit-columns:3;-moz-columns:3;columns:3;}
.resCol {
	-webkit-columns: auto;-moz-columns: auto;columns: auto;
	-webkit-column-width: 13em;-moz-column-width: 13em;column-width: 13em;
}

/* forms */
.formTable td{width:50%}
.formTable td{padding:0 0 .5em .5em}
.formTable td:first-child{padding:0 .5em .5em 0}
.formTable td[colspan="2"]{padding-right:0}
.formTable.formLoose,.formTable.formLoose td{width:auto}

/* content */
.photoright{margin:0 0 3em 4em;}
.photoleft{margin:0 4em 3em 0;}

/* HEADER ------------------------------*/
body>header{position: relative;z-index: 3; background:#fff}
body>header .tel {display: inline-block;float: right;}

.headWrap {max-width: 85em;margin: 0 auto;display: flex;justify-content: space-between;align-items: center;}
body>header.sticky { position: fixed; top: 0; }

#brand {
  max-width: 13.5em;
  padding: .2em 0 .2em 1.125em;
}

body>header.sticky #brand {
  max-width: 10em;
}


/* NAV ------------------------------ */
nav ul{margin: 0}
#mainnav{overflow:visible;margin-top: 0;float: right;}
#mainnav ul{text-align:right;overflow:visible;margin: 0;padding: 0;float: left;}
#mainnav li{display:inline-block;position:relative}
#mainnav a{line-height:2.4em;padding:0 .8em;display:inline-block;color: #2F3942; text-decoration:none;font-weight: 600;font-size: 1.25rem;margin-left: 1px;}
#mainnav>ul>li:hover>a, #mainnav>ul>li:active>a{background: #4476A1;color:#fff}
#mainnav>ul>li.on>a{background:#5086B6;;color:#fff}
/*dhtml*/
#mainnav li ul{display: none;}
#mainnav>ul>li:hover ul{display: block;}
#mainnav li ul{z-index: 10;width:240px;padding:.8em 0;background: #757575;position:absolute;overflow:hidden;height:auto;}
#mainnav>ul>li:last-child ul{right:0}
#mainnav li ul li{width:100%;display:block;float:left}
#mainnav ul li ul li a{color:#fff;font-weight: 400;line-height: 2.1}
#mainnav li ul li a{font-size:1em;line-height:1.1em;padding:0 .95em; display:block;width:100%;text-align:left;float:left}
#mainnav li ul li a:hover, .t1 li ul li a:active{color: #4476A1;background:#fff}
#mainnav .tel {color: #4476A1;font-weight: 700;}

#mainnav li ul li ul {
    background: rgba(255, 255, 255, .25);
    margin: 0 0 .375rem;
    padding: 0;
    position: static;
}

#mainnav li ul li ul li a {font-size: .9375em;padding-left: 1.5rem;}

/* ancillary */
#ancillary {position:absolute;right:0;top:0;padding: .75rem; color:#ccc;font-size:.875em;}
#ancillary ul{display: inline}
#ancillary li{display: inline;}
#ancillary a {display: inline-block;padding: .5em .8em; text-decoration:none;color:#999;}
#ancillary li:after {content: '\007C';}
#ancillary li:last-child:after {content: ''}
#ancillary a:hover, #ancillary a:active,#ancillary li.on a{color:#666}
#ancillary li.on a {text-decoration:none;color:#666}
#ancillary .search{display: inline;}
#ancillary .search input{display: inline-block;height: 30px;border: 1px solid #bfc1c4;box-shadow: none;margin-right: -5px;background-color: #fff;font-style: italic}
#ancillary .search button {border-radius: 0;height: 30px;padding: .4em .6em;background-color: #f1f1f1;color:#b7b7b7;border-top: 1px solid #bfc1c4;border-right: 1px solid #bfc1c4;border-bottom: 1px solid #bfc1c4}

/* mobile */
#mobilenav,.menu{display: none}

/* MAIN ------------------------------ */
//main>div>aside{width:17rem;padding-right: 2em; overflow:hidden;float: left;padding-top: .8em;}
main>div>aside {padding-right: 1.75em;padding-top: .8em;padding-bottom: 3em;}
/* content */
/*#content{float:right;width:calc(100% - 15rem);padding:0 0 50px;overflow:hidden;min-height:600px;position:relative}*/
body.fullWidth #content {
    width: 100%;
    margin: 0 auto;
    float: none;
}
.interior > main > .wrap {
    padding: 7em 1em 0;
    display: grid;
    grid-template-columns: 14.5em auto 14.5em;
    grid-template-areas: "sidebar content .";
}

.interior > main > .wrap #content {
    grid-area: content;
    overflow: hidden;
    min-height: 600px;
    position: relative;
    padding: 0 1em 6em;
}

.interior > main > .wrap > aside {
    grid-area: sidebar;
}

/* Homepage */
/* First section */
.slideContainer {position: relative;min-height: calc(80vh - 100px); }
.homeHeroBox {position: absolute;padding: 1em;;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 100%;}
.homeHeroBox h1 {font-size: 3.75em;text-transform: uppercase;}
.homeHeroBox p {font-size: 2rem;font-weight: 600;color: #fff;}

/* Second Section */
.callBox {width: calc(33% - 1em); margin: 0 .5em;float: left;}

/* Second Section a */
.homeCallouts-a {padding: 7em 1em}
.homeCallouts-a .callBox:hover span {color: #fff;}
.homeCallouts-a .callBox:hover {background-color: #5086B6;}
.homeCallouts-a h1 {}
.homeCallouts-a div div { display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
float: left;width: 100%;}
.homeCallouts-a .callBox {width: 230px;height: 230px;}

/* Third Section */
.homeAbout {padding: 10em 1em}
.homeAbout .homeRight {padding-left: calc(50% + 5em)}
.homeAbout .homeRight h1 {}
.homeAbout .homeRight a {}
.homeAbout hr {width: 100%;float: left}
.homeAbout .homeRight p:nth-child(3) {margin-bottom: 2em;}

/* Fourth Section */
.homeEvents .wrap {padding: 5em 1em;}
.homeEvents .homeLeft {width: 50%;float: left}
.homeEvents .homeRight {width: 50%;float: left;padding-left: 2em}

.homeRot {padding: 2.5em 1em}

.icon-links {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    margin: 2rem 0 1.5rem;
}

/* Top Footer */
.topFooter {padding: 7em 1em}
.topFooter h2 {font-size: 2.25em;}
.topFooter p {max-width: 40em;margin: 0 auto 2.25em;}

/* footer */
body>footer section {float: left;clear: both;width: 25%}
.fatFooter>nav{float: left;width: 25%}
.fatFooter>nav>ul{float: left;}
.fatFooter address {width: 25%;float: left}
.fatFooter .social {width:25%;float: right;text-align: right}
#web-solutions-exposure {width: 100%;float: left;text-align: center;}
.btmFooter a:before {content: '\00A0\00A0\007C\00A0\00A0'}
.fatFooter p span:after {content: '\00A0\00A0\00A0\2022\00A0\00A0'}

/* RESPONSIVE ------------------------------ */
@media screen and (max-width:1178px) {
  .interior > main > .wrap {grid-template-columns: 11em auto;    grid-template-areas: "sidebar content";padding-right: 5%;}
}
@media screen and (max-width:1100px) {
  .homeAbout .homeRight {padding-left: calc(50% + 2em)}
}

@media screen and (max-width:1088px) {
  .interior > main > .wrap {grid-template-columns: 11em auto;    grid-template-areas: "sidebar content";padding-right: 5%;  }
}

@media (max-width:1023px) {
  #video-cloud .column { padding: 4rem 1.5rem; }
  #video-solutions .column:nth-of-type(1) { padding: 0 3rem 0 0; }
}

@media screen and (max-width:840px) {
  #mainnav a {padding: 0 8px}
  .homeAbout .homeRight {    padding-left: calc(50% + 1.5em);}
  .homeAbout {    padding: 5em 1em;}
  .homeCallouts-a {padding: 3em 1em}
  .topFooter {    padding: 3.5em 1em;}
  .homeRot {    padding: 1.5em 1em;}
}
