@media screen{body{background-image:url(/images/services/main-bg.svg);&[data-page=index] #contact-callout{color:inherit;background:0 0;& a.cta{color:#fff;background-color:#353c48}}&:not([data-page=index]) #main-feature{overflow:visible;background-image:linear-gradient(#fff 0% 80%,#e5e9f180 100%)!important;&:before{content:"";background-image:linear-gradient(#0000,#0000001a);width:100%;height:8px;position:absolute;bottom:100%;left:0}}}#main-feature .inner{overflow:hidden}#main-content h2,#main-content h2+.subtitle{color:#a51d3c}#service-highlights{margin:16px 0}.service.highlight{color:#fff;position:relative;overflow:visible;& hgroup *{color:inherit!important}&:before,&:after{z-index:1;content:"";width:100%;height:75%;display:block;position:absolute}&:before{top:-2px}&:after{bottom:-2px}}#service-tech:before,#service-tech:after{background-color:#a51d3c}#service-human:before,#service-human:after{background-color:#353c48}#service-tech:before,#service-human:after{transform:skewY(-1deg)}#service-tech:after,#service-human:before{transform:skewY(1deg)}.service.highlight .inner{z-index:2;margin:0 auto;padding:64px 0;position:relative;overflow:hidden}#service-human .inner{flex-direction:row-reverse}.service.highlight{& .col.images{align-items:center;display:flex}& img{width:100%;max-width:400px;height:auto}& a.cta{background-color:#0000;border-color:#fff}}#service-tech a.cta:hover,#service-tech a.cta:focus,#service-tech a.cta:active{color:#a51d3c;background-color:#fff}#service-human a.cta:hover,#service-human a.cta:focus,#service-human a.cta:active{color:#353c48;background-color:#fff}#field-anchors{justify-content:center;margin:16px 0;padding:0;list-style:none;display:flex;& li{margin:16px;padding:0}& a{color:#fff;background-image:linear-gradient(#be1b51,#a51d3c);border-radius:50%;flex-direction:column;justify-content:center;align-items:center;width:160px;height:160px;display:flex;position:relative;box-shadow:0 2px 4px #00000080;&:hover,&:focus,&:active{outline:0;top:-4px}&:before{opacity:.2;content:"";background-position:50%;background-repeat:no-repeat;background-size:contain;width:100%;height:64px;position:absolute;top:16px;left:0}}}#field-anchors a[href=\#web]:before,#web .inner:before{background-image:url(/images/services/tech/web.svg)}#field-anchors a[href=\#browser]:before{background-image:url(/images/services/tech/browser.svg)}#browser .inner:before{background-image:url(/images/services/tech/browser-inverse.svg);opacity:.03!important}#field-anchors a[href=\#openness]:before,#openness .inner:before{background-image:url(/images/services/tech/openness.svg)}#field-anchors{& .fas{color:#fff;opacity:1;letter-spacing:0;width:100%;margin:0;font-size:1.5rem;position:absolute;bottom:16px;left:0}& strong{font-size:1.5rem;font-weight:400;line-height:1}& span{text-transform:uppercase;letter-spacing:.5ex;opacity:.5;margin:4px 0;font-size:.875rem}}#web,#openness{background-color:#f4f0f7}#fields{&>header{padding:48px 0}& .field{padding:48px 0;position:relative;& .inner{min-height:280px;position:relative;&:before{z-index:1;opacity:.6;pointer-events:none;content:"";background-position:50%;background-repeat:no-repeat;background-size:280px 280px;height:100%;position:absolute;top:0;left:16px}}& .col{z-index:2;flex-direction:column;justify-content:center;display:flex;position:relative}& .summary{text-align:center;letter-spacing:-.05ex;font-size:1.125rem;font-weight:700}}}#tech-solutions{& header p{text-align:center}& .examples{flex-wrap:wrap;justify-content:center;margin:24px 0;padding:0;list-style:none;display:flex;& li{box-sizing:border-box;background-color:#e5e9f1;background-position:24px;background-repeat:no-repeat;background-size:64px;border-radius:8px;flex:none;max-width:448px;margin:8px;padding:24px 24px 24px 104px}}}#human-solutions{& .col{margin:16px}& .tiles{text-align:center;& img{width:100%;height:auto}& h3{margin:16px 0 8px}& p{margin:0}}}#fullstack{background-color:#f3f5f8;& .col{flex-direction:column;justify-content:center;display:flex}& header:before{content:"";background:url(/images/services/human/fullstack.svg) 50%/contain no-repeat;width:100%;height:96px;margin:0 0 16px;display:block}}.case{border:2px solid #353c48;border-radius:8px;margin:32px 0 0;padding:32px;& h3{text-align:center;& .prefix{color:#fff;vertical-align:2px;background-color:#353c48;border-radius:4px;padding:2px 8px;font-size:.875rem;font-weight:400}}& .content{flex-direction:row-reverse;display:flex}& figure{flex:none;margin:16px 0 0 16px;display:block}& img{width:320px;height:auto}& p{margin-bottom:0}}#fullstack-hero img{object-fit:cover;width:100%;height:240px}#fullstack-row-1{& ul{margin:24px 0;padding:0;list-style:none}& li{background-color:#e5e9f1;border-radius:8px;align-items:center;gap:16px;margin:8px 0;padding:16px;display:flex;& .fas{color:#fff;text-align:center;flex:none;width:40px;height:40px;margin:0;font-size:40px}}}#fullstack-row-2{background-color:#f4f0f7;& ul{margin:16px 0;padding:0;line-height:1.5;list-style:none}& li{margin:12px 0}}#fullstack-instructors{& li,& div.inline{align-items:center;gap:16px;display:flex}& .name{flex:none;font-weight:700}& img{object-fit:cover;border-radius:50%;width:56px;height:56px}}}@media screen and (width>=1280px){#fields .field .inner:before{width:352px;right:auto}#fullstack-hero img{height:320px}}@media screen and (width>=1024px) and (width<=1279px){#fields .field .inner:before{width:288px;right:auto}}@media screen and (width>=1024px){.service.highlight{& .col{flex-direction:column;justify-content:center;display:flex}& .cta-outer{text-align:right;margin:0}& header *{text-align:left}}}@media screen and (width<=1023px){.service.highlight p{text-align:center}#fields .field{& .inner:before{background-position:50% 16px;width:auto;right:16px}& .summary{max-width:600px;margin:0 auto}}.case{& .content{flex-direction:column}& figure{margin:16px 0 0}}}@media screen and (width>=768px) and (width<=1023px){.service.highlight .cta-outer{margin:32px 0}#tech-solutions .examples li{width:calc(50% - 16px)}#human-solutions .tiles{flex-wrap:wrap;display:flex;& .col{width:calc(50% - 32px)}}}@media screen and (width>=768px){#tech-solutions,#human-solutions{margin:48px 0}#fields .field h3{font-size:2rem}#fullstack-row-1 section[id],#fullstack-row-2 section[id]{margin:48px 0}}@media screen and (width<=767px){.service.highlight{& .inner{padding:48px 0}& .cta-outer{text-align:center;margin:32px 0}}#field-anchors{flex-direction:column;align-items:center}#tech-solutions,#human-solutions{margin:32px 0}#tech-solutions .examples li{width:100%}.case{padding:16px;& h3 .heading{margin-top:4px;display:block}}#fullstack-row-1 section[id],#fullstack-row-2 section[id]{margin:32px 0}}
