@charset "UTF-8";

:root{
--blue:hsla(206,95%,25%,1);
--bluedark:hsla(206,95%,18%,1);
--bluelight:hsla(206,95%,28%,1);
--bluesuperlight:hsla(206,95%,98%,1);
--grey:hsla(206,6%,45%,1);
--greydark:hsla(206,6%,25%,1);
--greylight:hsla(206,6%,65%,1);
--greysuperlight:hsla(206,6%,95%,1);
--orange:hsla(26,95%,55%,1);
--white50:hsla(0,0%,100%,.5);
--white70:hsla(0,0%,100%,.7);
--white90:hsla(0,0%,100%,.9);
--subbackgrad:linear-gradient(to bottom,hsla(206,95%,18%,.5),hsla(206,95%,18%,.5));
}
*{background:0 0;border:0;box-sizing:border-box;margin:0;outline:0;padding:0;vertical-align:baseline}
a{color:var(--orange);text-decoration:none;transition:all .2s ease-in-out}
a:hover{text-decoration:underline}
body{background-color:var(--bluedark);color:var(--grey);font-family:'Lato',Arial,sans-serif;font-size:17px}
h1,h2,h3,h4,h5,h6{font-weight:normal;line-height:1}
hr{border:0;border-top:1px dotted var(--greylight);margin:2rem 0}
html{font-size:100%;min-height:101%;width:100%}
img{height:auto;max-width:100%}
p{font-size:17px;line-height:1.6;margin-bottom:1.2em}
sup{font-size:.6em;bottom:.8ex;margin:0 .1rem;position:relative;vertical-align:0}

/*AboveHeader*/
.aboveheader{background-color:var(--greylight);color:white;font-size:.9rem;padding:.6rem 0}
.aboveheader a{color:var(--white70);text-decoration:none}
.aboveheader a:hover{color:white}
.aboveheader span + span{margin-left:4em}
.aboveheader-grid{display:grid;grid-template-columns:auto auto;justify-content:space-between}

/*Accordion*/
.accordion-toggle{cursor:pointer;display:inline-block;font-size:.7rem;font-weight:400;margin-bottom:1rem;text-transform:uppercase}
.accordion-content{display:none}

/*Animate*/
.animate-up{animation:slide-up 1s ease-out 4s forwards}

/*Awards*/
.awards{background:linear-gradient(var(--greysuperlight),white 20%)}
.awards-image{margin:0 auto 1rem;max-width:17rem}
/*Bars*/
.bar{padding:4rem 0;text-align:center}
.bar-title{font-size:calc(1.7rem + .5vw);margin-bottom:.2em;text-align:center}
.bar-title--boxes{color:white;font-size:calc(1.7rem + .5vw);margin-bottom:1em;text-align:center}
.bar-title-sub{font-size:calc(1.1rem + .2vw);line-height:1.5em;margin-bottom:2rem}
.bar-title-sub--cta{font-size:calc(.9rem + .2vw);line-height:1.5em;margin-bottom:2rem}

/*Boxes*/
.boxes{--cols-boxes:4;background:linear-gradient(var(--orange),white 24rem)}
.boxes-grid{display:grid;grid-gap:3rem 2rem;grid-template-columns:repeat(var(--cols-boxes),1fr)}
.boxes-item-text p{margin-bottom:0}
.boxes-item-title{font-size:calc(1rem + .4vw);line-height:1.2;margin-bottom:.4em}
.boxes-item img{border:2px solid white;box-shadow:.1rem .1rem 1rem .1rem var(--grey);filter:grayscale(1);margin-bottom:1rem;transition:all .4s ease}
.boxes-item img:hover{filter:grayscale(0)}

/*Breadcrumbs*/
.breadcrumbs{color:var(--greylight);font-size:.9rem;margin-bottom:1.5rem;text-transform:uppercase}
.breadcrumbs a{padding-right:.5em}
.breadcrumbs a:after{color:var(--greylight);content:'>';display:inline-block;padding-left:.5em}

/*Buttons*/
.btn{border-radius:2em;display:inline-block;line-height:1;padding:.6rem 1.2rem;transition:all .2s}
.btn:hover{text-decoration:none}

/*Contact*/
.contact-grid{display:grid;grid-template-columns:1fr 1fr;margin-bottom:2rem}

/*Content*/
.content{margin:0 auto;max-width:1180px;padding:0 30px}

/*CTA*/
.cta{background-color:var(--greylight);color:white}
.cta-btn{border:2px solid var(--white90);color:white;font-size:calc(1rem + .2vw)}
.cta-btn:hover{background-color:var(--orange);color:var(--greydark)}

/*Customers*/
.customers-grid{--cols-customers:5;align-items:center;display:grid;grid-gap:2rem 1rem;grid-template-columns:repeat(var(--cols-customers),1fr);justify-items:center}

/*Footer*/
.footer{color:var(--white70);padding-bottom:8rem}
.footer a:hover{color:white;text-decoration:none}
.footer p{font-size:.9rem;margin-bottom:0}
.footer-grid{display:grid;grid-template-columns:repeat(3,1fr);justify-items:center;margin-bottom:3rem}
.footer .footer-large{font-size:1.1rem;line-height:1.8}

/*Header*/
.header{background-color:white;box-shadow:0 .5rem 2rem .2rem hsla(180,3%,25%,.2);position:fixed;width:100%;z-index:10}
.header-grid{align-items:center;display:grid;grid-column-gap:3em;grid-template-columns:auto 1fr auto}

/*Hero*/
.hero{background:linear-gradient(to bottom,hsla(206,5%,0%,.5),hsla(206,5%,0%,.4) ),url(../images/background.jpg) center no-repeat;background-size:cover;padding:calc(12rem + 5vw) 0 30rem}
.hero h1{animation-delay:1s;color:var(--white90);font-size:calc(3.5rem + 1vw);margin-bottom:.3em;opacity:0}
.hero h2{animation-delay:3s;color:var(--white90);font-size:calc(1.3rem + .2vw);line-height:1.3;margin-bottom:3rem;opacity:0}
.hero-links-grid{display:grid;grid-gap:.5rem;grid-template-columns:repeat(auto-fit,180px);justify-content:center;opacity:0}
.hero-links-grid a{background-color:hsla(0,0%,0%,.3);border-radius:.2rem;font-size:calc(.8rem + .2vw);padding:.5rem 1rem;text-decoration:none;text-transform:uppercase}
.hero-links-grid a:hover{background-color:var(--orange);color:white;transform:scale(1.1)}

/*Installations*/
.installations-grid{align-items:center;display:grid;grid-auto-flow:column;grid-gap:2rem;justify-content:start;margin-top:2rem}

/*Intro*/
.intro{background:linear-gradient(to bottom,hsla(206,95%,25%,.96),hsla(206,95%,25%,.99) ),url(../images/ati-circles.png) center no-repeat;color:white}
.intro p{font-size:1.1rem;margin:1rem auto;max-width:900px}
.intro-btn{border:2px solid var(--orange);color:var(--orange);font-size:calc(.8rem + .1vw);letter-spacing:1px;text-transform:uppercase}
.intro-btn:hover{background-color:var(--orange);color:white}

/*Logo*/
.logo{max-width:15rem;}

/*Markets*/
.markets-grid{display:grid;grid-gap:0 3rem;grid-template-columns:auto auto;justify-content:start}
.markets-grid .u-marginbot0{margin-bottom:0}

/*Nav*/
.nav a{color:var(--grey);text-decoration:none;text-transform:uppercase;white-space:nowrap}
.nav a:hover,.nav-drop:hover .nav-drop-target a{color:var(--orange)}
.nav-category-grid{display:grid;grid-template-columns:repeat(5,1fr)}
.nav-contain{justify-self:end}
.nav-drop{position:relative}
.nav-drop:hover{cursor:pointer}
.nav-drop:hover .nav-drop-items{opacity:1;transition-delay:0s,0s,.2s;visibility:visible}
.nav-drop:hover .nav-drop-anchor::after{border-color:var(--orange) transparent transparent}
.nav-drop-anchor::after{border:.3em solid;border-color:var(--grey) transparent transparent;content:"";display:inline-block;margin-left:.4rem;transition:all .2s}
.nav-drop-category{color:var(--greylight);cursor:auto;padding:.3em 1em .3em}
.nav-drop-items{background-color:white;border-radius:0 0 .2rem .2rem;font-size:1rem;left:-.9em;min-width:100%;opacity:0;padding-bottom:.5em;position:absolute;top:100%;transition: all .2s ease-in-out 0s,visibility 0s linear .2s,z-index 0s linear .01s;visibility:hidden}
.nav-drop-items a{display:block;padding:.5em 1.8em .5em 1em}
.nav-drop-items a:hover{background-color:var(--orange);color:white}
.nav-grid{display:grid;grid-auto-flow:column;grid-column-gap:calc(.5em + 1vw);justify-content:start}
.nav-grid > div{padding:4rem 0 2rem}
.nav-home{display:none}
.nav-toggle{display:none}

/*Products*/
.productpage-grid{display:grid;grid-gap:2rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.products-grid{display:grid;grid-gap:2rem;grid-template-columns:repeat(4,1fr);justify-content:start}
.products-item{text-align:center}
.products-item img{max-height:120px}
.products-item p{margin-bottom:.5em}

/*Ripcord*/
.ripcord{background-color:hsla(0,0%,0%,.1);border:1px solid hsla(0,0%,100%,.3);border-radius:.5rem;display:inline-block;font-size:.7rem;letter-spacing:1px;padding:.5rem 1rem;text-transform:uppercase}

/*Side*/
.sidequote{color:var(--greylight);float:right;font-size:1.8rem;font-weight:300;line-height:1.3;max-width:20rem;padding:0 0 3rem 4rem}

/*Social*/
.social .fab{font-size:1.3rem}
.social .fab + .fab{margin-left:.7rem}

/*SubContent*/
.subcontent{background-color:white;padding:4rem 0;text-align:left}
.subcontent li{list-style-position:inside;text-indent:-1em}
.subcontent li + li{padding-top:1rem}
.subcontent ul{margin:1.5rem 0 1.5rem 1.2em}
.subcontent-title{font-size:calc(1.6rem + .5vw);margin-bottom:.5em}
.subcontent-title-section{font-size:calc(1rem + .2vw);letter-spacing:1px;margin:3rem 0 .8em;text-transform:uppercase}
.subcontent-title-section--products{margin:1.5em 0 0;text-transform:uppercase}
.subcontent-title-section--products:first-of-type{margin:0}
.subcontent-title-section--sm{font-style:italic;margin:1.4em 0 .5em}
.subcontent-title-sub{border-bottom:1px dotted var(--greylight);font-size:calc(1.1rem + .2vw);letter-spacing:1px;margin:0 0 1.5em;padding-bottom:1.4em}
.subcontent-title-sub--anchors{border-bottom:1px dotted var(--greylight);font-size:calc(.8rem + .2vw);letter-spacing:1px;margin:0 0 2em;padding-bottom:1.4em}
.subcontent-title-sub--anchors a:after{color:var(--greylight);content:'|';display:inline-block;margin-left:.6em}
.subcontent-title-sub--anchors a:last-child:after{content:''}
.subcontent-title-sub--anchors a + a{padding-left:.6em}

/*SubBack*/
.subback{height:calc(16rem + 10vw)}
.subback-about{background:var(--subbackgrad),url(../images/subback-about.jpg) center top/cover}
.subback-campus{background:var(--subbackgrad),url(../images/subback-campus.jpg) center top/cover}
.subback-community{background:var(--subbackgrad),url(../images/subback-community.jpg) center top/cover}
.subback-contact{background:var(--subbackgrad),url(../images/subback-contact.jpg) center top/cover}
.subback-industrial{background:var(--subbackgrad),url(../images/subback-industrial.jpg) center top/cover}
.subback-markets{background:var(--subbackgrad),url(../images/subback-markets.jpg) center top/cover}
.subback-military{background:var(--subbackgrad),url(../images/subback-military.jpg) center top/cover}
.subback-media{background:var(--subbackgrad),url(../images/subback-media.jpg) center top/cover}
.subback-products{background:var(--subbackgrad),url(../images/subback-products.jpg) center top/cover}
.subback-services{background:var(--subbackgrad),url(../images/subback-services.jpg) center top/cover}

/*SubPic*/
.subpic{float:right;max-width:300px;margin:0 0 2rem 2rem}

/*Utility*/
.u-anchor{margin-top:-11rem;padding-top:11rem}
.u-caption{font-size:.9rem}
.u-gridrow{grid-column:1/-1}
.u-narrow{padding:0 10vw}
.u-smtext{font-size:.9rem}

.videos-grid{display:grid;grid-auto-rows:minmax(200px,auto);grid-gap:1rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.videos-grid iframe{background-color:var(--greysuperlight);border:1px solid var(--greylight);padding:.3rem .4rem}

@keyframes slide-left {
from{opacity:0;transform:translateX(200px)}
to{opacity:1;transform:translateX(0)}
}
@keyframes slide-right {
from{opacity:0;transform:translateX(-200px)}
to{opacity:1;transform:translateX(0)}
}
@keyframes slide-up {
from{opacity:0;transform:translateY(50px)}
to{opacity:1;transform:translateY(0)}
}

@media only screen and (max-width: 1000px) {
.bio-grid-horizontal,.contact-grid,.footer-grid,.nav-grid{grid-template-columns:1fr}
.boxes{--cols-boxes:2}
.customers-grid{--cols-customers:4}
.footer-grid{grid-gap:0}
.header-grid{padding:1rem 0 1rem 5vw}
.hero{padding:20rem 0 4rem}
.nav{background-color:hsla(240,2%,10%,.9);bottom:0;left:100vw;position:fixed;top:0;transition:transform .3s ease-in-out;width:60vw}
.nav:target{transform:translateX(-60vw)}
.nav-category-grid{grid-template-columns:1fr}
.nav-client,.nav-home{display:block}
.nav-drop-items{display:none}/*remove*/
.nav-drop:hover{cursor:pointer}
.nav-drop:hover .nav-drop-items{display:block;opacity:1;transition-delay:0s,0s,.2s;visibility:visible}
.nav-drop:hover .nav-drop-items.nav-drop-products{display:none}
.nav-drop:hover .nav-drop-anchor::after{border-color:var(--orange) transparent transparent}
.nav-grid{grid-auto-flow:row;padding-left:10vw}
.nav-grid > div{padding:1rem 0 0}
.nav-grid > div:first-of-type{padding-top:0}
.nav-drop .nav-drop-category{padding-top:.6em}
.nav-drop-anchor::after{border:none}
.nav-drop-items{background-color:transparent;margin-top:0;opacity:1;padding:.3rem 0 0 1rem;position:initial}
.nav-drop-items a{display:inline-block;margin-top:.2rem;padding:.3rem}
.nav-drop-items div{line-height:1;margin:0;padding:0}
.nav-toggle{display:block}
.nav-toggle-close{display:block;font-size:3rem;padding:1rem 3rem 0 0;text-align:right}
.nav-toggle-open{font-size:1.5rem}
.products-grid{grid-template-columns:1fr 1fr}
.subpic{display:none}
}
@media only screen and (max-width: 700px) {
.boxes-grid{grid-gap:4rem;grid-template-columns:1fr}
.customers-grid{--cols-customers:3}
.sidequote{display:none}
}
@media only screen and (max-width: 600px) {
.aboveheader{display:none}
.markets-grid{grid-template-columns:1fr}
.nav{width:100vw}
.nav:target{transform:translateX(-100vw)}
.products-grid{grid-template-columns:1fr}
}
@media only screen and (max-width: 400px) {
.customers-grid{--cols-customers:2}
.header-grid{grid-template-columns:1fr;justify-items:center}
.logo{margin-bottom:1rem}
.nav-contain{justify-self:center}
}
@media print {
body{margin:0 10%}
.header,img,.nav{display:none}
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
a{color:orange}
.footer{background-color:black}
.header,.logo-bottom,.logo-top{text-align:center}
.hero h1,.hero h2{color:white}
.nav-drop-anchor:after{display:none}
.nav-grid > div{display:inline-block;padding:1em}
}