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

/* Main overrides */

/* 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;}


/* 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}

/* Font */
h1 {font-size: 1.9em}
h2 {font-size: 1.7em}
h3 {font-size: 1.5em}
h4 {font-size: 1.3em}

/* nav */
#navContainer{position: fixed;left: 100%;top:0;bottom:0;width: 75%;background-color:#082344;z-index:99;-webkit-transition: left 200ms ease;transition: left 200ms ease}
.slideNav #navContainer{left: 25%;}
#navContainer nav{display: inline}
#navContainer ul{display: block;float: left;width: 100%;margin: 0;padding-left: 0}
#navContainer li{display:block;float: left;width: 100%; position: relative;border-top: 1px solid rgba(255,255,255,.5)}
#navContainer>nav>ul>li:last-child {border-bottom: 1px solid rgba(255,255,255,.5)}
#navContainer a, #navContainer .menu{color:#fff;line-height:2em;padding:0 1rem;display:block;float: left;width: 100%;font-size: 1.13em;}
#navContainer .menu:before {content: '\2039';margin-right: 4px}
#navContainer a:hover,#navContainer .menu:hover,
#navContainer li.on a{background-color:rgba(000,000,000,.35);color: #fff}
#navContainer li.open{background-color: rgba(000,000,000,.35)}
#navContainer li>span{color: #000;background-color:#fff;opacity: .1; 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}
#navContainer li>span:hover, #navContainer li.on>span{opacity: .3}
#navContainer li>span:before{content: "\25B8"}
#navContainer li.open>span{transform: rotate(90deg)}
#navContainer ul ul {font-size: .9em;}
#navContainer ul ul a {padding-left: 2rem;color: #fff;}
#mainnav ul li ul li a {color: #fff;font-family: "adrianna-condensed",sans-serif}
#navContainer ul ul {display: none;}
nav#ancillary form.search {width: 100%;float: left;padding: .5em;border-top: 1px solid #666}
nav#ancillary form.search input {width: calc(100% - 30px);background-color: #fff;box-shadow: none}
nav#ancillary form.search button {width: 30px;background: none;}

#mobilenav{background-color: #082344;float: left;width: 100%;text-align: center}
#mobilenav a, #mobilenav span{width: 33.3%;display: block;float: left;color: #fff;line-height: 2.5rem;font-size: 1.3em;}
#mobilenav a:hover, #mobilenav span:hover{color: #fff;background-color:#5086B6}
.hamburger{height: 2em;width: 2em;display: block;position: fixed;right: 0;top:0;opacity: .5;background: url(/images/m/hamburger.svg);background-size: cover;z-index:1;opacity: 0}
.hamburger.on{opacity: .3}

#brand {
  margin-inline: auto;
  max-width: 12em;
  padding: .375em 0;
  width: 100%;
}

#sidenav{background: #D6E1EA}
#sidenav li.on ul li a {padding-left: 2em;}
#sidenav li ul li.on ul li a {padding-left: 3em;}

/* content */
.photoright{margin:0 0 .75em 1em;}
.photoleft{margin:0 1em .75em 0;}
.sideCall {border-bottom-right-radius: 0;border-bottom-left-radius: 0}

/* main */

/* Homepage */
.slideContainer {position: absolute;bottom: 0;top: 0}
.homeHeroBox {position: absolute;top: 0;left: 0;bottom: 0;right: 0;padding: 2em 1em}
.homeCallouts-a, .homeCallouts-b {padding: 3.25em 1em 2em}
.homeCallouts-a .callBox {width: 100%;height: 11em;}
.homeCallouts-a .callBoxBG {height: 14em;}
.homeHeroBox h1 {font-size: 2em;text-transform: uppercase;}
.homeHeroBox p {font-size: 1.5rem;font-weight: 600;color: #fff;}
.homeCallouts-b .callBox {width: 100%;height: 24em;}
.homeCallouts-b .callBoxBG {height: 14em;}


/* Third Section */
.homeAbout {padding: 2em 0}
.homeAbout .homeLeft, .homeAbout .homeRight {width: 100%}
.homeAbout .homeLeft:after {position: absolute;top: 0;bottom: 0;right: 0;left: 0;content: '';background-color: rgba(000,000,000,.8)}
.homeAbout .homeRight * {color: #fff}
.homeAbout .homeRight {padding: 0 1em;}

.topFooter {padding: 2em 1em}

.icon-links a {display: block; float: none; max-width: 20em; text-align: center; margin: 0 auto 1em; background: #ececec; padding: 1em 1em 1.5em; border-radius: 3px}


/* footer */
body>footer {text-align: center}
body>footer .wrap{
	display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -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;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
}
#web-solutions-exposure{
	-webkit-order: 1;
    -ms-flex-order: 1;
    order: 1;margin-top: 1em;font-size: .9em
}

.fatFooter span, .btmFooter a {display: block;width: 100%;}

/* VIDEO SURVEILLANCE PAGE ------------------------------ */

ul.blue li { padding: 0 0 0 1.25rem; }

#video-solutions, #video-quote, #video-cloud .column { padding: 4rem 1.5rem; width: 100%; }
#video-solutions h2, #video-cloud h2 { font-size: 1.375rem; }
#video-solutions .flex-row, #video-cloud .flex-row { flex-direction: column; }
#video-solutions li, #video-cloud li { width: 100%; }

#video-hero { padding: 5rem 1.5rem; }
#video-hero h1 { font-size: 1.9rem; }
#video-hero .button { margin: .75rem .25rem 0; }

#video-solutions .column, #video-solutions .column:nth-of-type(1) { padding: 0; width: 100%; }
#video-solutions img { margin: 0 auto 2rem; }

#video-cloud::after { display: none; }
#video-cloud .column:nth-of-type(2) { background: rgba(214, 225, 234, .25); }

@media (max-width: 550px) {
  #video-quote label { width: 100%; }
}
