:root { --main-bg: #fff; --light: #f5f5f5; --light-comp: #4d4d4d; --dark: #222; --dark-comp: #fff; --primary: #ca3926; --primary-comp: #fff; --secondary: #e72f25; --secondary-comp: #fff; }
/* GENERAL */
body { font-family: 'Montserrat', Arial, Helvetica, sans-serif; font-size: 18px; line-height: 1.6; text-align: center; min-width: 320px; }
body, nav a, .top a:hover, .call a:hover, .solutions h3 span, .solutions a, .news .post h2 a { color: var(--light-comp, #4d4d4d); }
body, header ul, footer ul { padding: 0; margin: 0; }
h1, h2, h3, h4, h5, h6, p, th, td, dd, dt, li, blockquote { text-align: left; }
h1, h2, h3, h4, h5, h6, .solutions .grid li { line-height: 1.4; }
img, iframe { max-width: 100%; height: auto; display: block; margin: 0 auto; }
iframe, .youtube { display: block; aspect-ratio: auto 16 / 9; width: 100%; margin: 1em auto; outline: 1px solid #eee }
.fullwidth { width: 100%; }
a img, iframe { border: none; }
a, .featured h2, .solutions h3 { transition: ease-in-out .3s; }
a, header a:hover, form input[type=submit]:hover, .btn:hover, .address a:hover, .featured .grid>*:hover, footer a:hover, .solutions a:hover, .news .post h2 a:hover { text-decoration: none; }
a, header a:hover, footer a:hover, .featured .grid > *:hover h2, .address a:hover, .contact a:hover, .solutions a:hover h3, .news .post h2 a:hover { color: var(--primary, #ca3926); }
a:hover { text-decoration: underline; }
hr { border-width: 1px; border-color: #eee; border-style: none none solid; margin: 40px 0; }
.imgLeft, .imgRight { max-width: 45%; }
.imgLeft { float: left; margin: 10px 4% 2% 0; }
.imgCenter { display: block; margin: 0 auto; }
.imgRight { float: right; margin: 10px 0 2% 4%; }
.clear { clear: both; }
.nowrap, a[href^=tel] { white-space: nowrap; }
sup { line-height: 0; }
.hide { display: none !important; }
.center, .hero h1, .hero p, .comments h2, .comments p, .address h2, .address li, .contact h3, .contact li { text-align: center; }
.wrap { display: block; max-width: 1150px; margin: 0 auto; position: relative; }
.bg-dark, .bg-primary, .top a, .hero h1, .hero p, .featured .grid > *, .featured h2 span, .address h2, .address a, .pro, footer a { color: var(--dark-comp, #fff); }
.address h2 {margin:0; padding-top:10%;}
.bg-dark { background-color: var(--dark, #222); }
.bg-primary { background-color: var(--primary, #ca3926); }
.bg-light { background-color: var(--light, #f5f5f5); padding:20px; }
.mid { align-items: center; align-self: center; }
.grid { display: grid; grid-gap: 10px 20px; }
.grid.half { grid-template-columns: repeat(2,1fr); }
.grid.third { grid-template-columns: repeat(3,1fr); }
.grid.fourth { grid-template-columns: repeat(4,1fr); }
.nogap, .solutions .grid, .contact > .grid { grid-gap: 0; }
svg { stroke-width: 1px; }
/* HEADER & NAVIGATION */
header, .hero, .pro, .featured .grid > * { position: relative; }
header { z-index: 999; }
header .wrap .grid, .subfoot { padding: 20px 10px; }
header .grid { grid-template-columns: 400px 1fr; }
header .grid > div:last-of-type, .top, footer .grid div:last-of-type { text-align: right; }
header .logo { font-weight: bold; }
.logo div { display: grid; grid-template-columns: 200px 1fr; align-items: center; grid-gap: 10px }
.logo p { font-size: 18px; color: #094891; }
.logo p span { color: #ca3926; }
header ul, header li { display: inline-block; }
nav li { margin-left: 20px; text-align: center; }
nav li:last-of-type { font-weight: bold; text-transform: uppercase; line-height: 1; vertical-align: middle; margin-left: 40px; }
nav li:last-of-type a { display: block; max-width: 120px; color: #094891; }
.top { line-height: 1; background-image: linear-gradient(to right, #fff 60%, #ca3926 60%); }
.top ul { background-color: #ca3926; }
.top ul:first-of-type { padding: 12px 20px; border-radius: 0 0 0 5px; }
.top li { border-left: 1px solid #fff; }
.top li a { display: block; margin: 0 10px; }
.social li a { margin: 0 0 0 5px; }
.top .social li:last-of-type { margin-right: 15px; }
.top svg { vertical-align: middle; }
.top li:first-of-type, .social li { border: none; }
.top, .home h2 span, .next p, .featured p, .solutions h3 span, .solutions li, footer { font-size: 16px; }
/* HERO */
.hero, .pro, .cover { background-size: cover; background-position: center; }
.hero { box-shadow: 0 5px 5px rgba(0,0,0,.2); }
.hero:before, .pro:before, .featured .grid > *:before { content: ""; position: absolute; }
.hero:before, .pro:before, .featured .grid > *:before { width: 100%; height: 100%; background-color: rgba(0,0,0,.6); top: 0; left: 0; z-index: 1; }
.hero { width: 100%; height: 400px; }
.hero > .wrap, .pro .wrap { padding: 0 10px; top: 50%; transform: translateY(-50%); z-index: 1; }
.hero h1, .hero p { margin: 0; text-shadow: 2px 2px 3px rgba(0,0,0,.3); }
.hero h1 { font-size: 30px; }
.hero span, .home h2 span, main h2 span, .solutions h3 span { display: block; }
.bgimg { position: relative }
.bgimg > img:first-of-type { position: absolute; width: 100%; height: 100%; inset: 0; object-fit: cover; z-index: 0 }
.hero.bgimg > img { object-position: 50% 50% }
/* HOME */
.home > div, div.address .grid { padding: 50px 10px 100px;}
.home h2, .pro h2, .featured h2 { font-size: 24px; }
.next h2, .featured h2 span, .solutions h3 span { font-weight: 400; }
div.next { padding: 20px 10px 60px; }
.next .grid { grid-template-columns: 395px 1fr; }
.next .grid div { padding: 0 0 0 50px; }
.next h2 { line-height: 1.6; }
.next h2 span { color: #094891; }
.next img { margin-left: -10px; }
.pro { height: 500px; }
.pro>img{object-position:top}
.pro>div{margin-left:min(30vw, 300px);text-shadow:1px 1px 1px #666}
.pro:before { background-color: rgba(0,0,0,.1); background-image: linear-gradient(to right, transparent, #000 80%); }
.featured .grid { grid-gap: 10px; padding: 40px 0; }
.featured .grid > *, .featured .grid > *:before, .featured img { border-radius: 5px; }
.featured .grid > * { height: 450px; overflow: hidden; outline: 1px solid #ddd }
.featured .grid > *:before { background-color: unset; background-image: linear-gradient(#333 30%,transparent); }
.featured img, .address img, .solutions .grid img { object-fit: cover;height:100%; width: 100%; zoom: 150%;position:absolute;inset:0;z-index:0 }
.featured .grid > * div { padding: 20px; position: absolute; top: 0; left: 0; z-index: 999; }
.featured .grid > *:nth-of-type(2) img { object-fit: cover; }
.featured .grid > *:nth-of-type(3) img, .featured .grid > *:nth-of-type(5) img, .featured .grid > *:nth-of-type(6) img, .solutions .grid img { zoom: unset; }
.featured .grid > *:nth-of-type(4) img { object-position: right; zoom: 130%; }
div.address { padding: 0; }
/* .address img { height: 300px; } */
.homepagecontact {background-image:linear-gradient(rgba(255,255,255,0.9), rgba(255,255,255,0.9)), url(/images/contact-us-background.jpg); background-position: top; background-size:cover; background-repeat: no-repeat; background-attachment: fixed;}
.homepagecontact .wrap { padding: 0 10px }
/* FORMS */
form { margin: 20px 0; }
form .grid { grid-gap: 0 10px; }
form label { display: block; }
form input[type=text], form input[type=email], form input[type=tel], form input[type=file], form input[type=submit], form select, form textarea, form input[type=password], .btn { font-family: 'Montserrat', sans-serif; font-size: 16px; }
form input[type=text], form input[type=email], form input[type=tel], form select, form textarea, form input[type=password] { background-color: var(--light, #f5f5f5); margin-bottom: 10px; padding: 0 10px; border-radius: 5px; border: none; }
form input[type=text], form input[type=email], form input[type=tel], form select, form input[type=password] { height: 50px; }
form input[type=text], form input[type=email], form input[type=tel], form textarea, form input[type=password] { width: calc(100% - 20px); 
background:#fff; border:0.5px solid #eee;
box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px;}
form select { width: 100%; }
form input[type=file] { margin-left: 10px; border-radius: 5px; }
form textarea { height: 150px; padding: 15px 10px; }
form input[type=submit], .btn { display: inline-block; min-width: 110px; text-align: center; line-height: 2; background-color: var(--primary, #ca3926); color: var(--primary-comp, #fff); padding: 10px 40px; margin: 10px 0; border: none; border-radius: 5px; transition: ease-in-out .3s; }
form input[type=submit] { min-width: 250px; margin: 0; }
form input[type=submit]:hover, .btn:hover { cursor: pointer; background-color: var(--secondary, #e72f25); color: var(--primary-comp, #fff); }
/* FOOTER */
footer { margin-top: 50px;clear:both }
footer .grid.fourth { padding: 40px 0 50px; }
footer .grid.fourth div { padding: 0 25px; }
footer .call { background-color: #ca3926; padding: 30px 60px 65px; border-radius: 5px 5px 0 0; box-shadow: 0 -4px 5px rgba(0,0,0,.2); position: absolute; top: -40px; right: 0; }
.call h2 { margin-bottom: 0; }
.call h3 { padding-top: 30px; }
.ccpaNotice { text-align: center !important; background: var(--light, #f5f5f5) !important; }
/* MAIN & EVERYTHING ELSE */
main { padding: 40px 10px; }
main iframe, main img,.youtube { border-radius: 5px; }
main iframe { margin: 40px 0; }
main strong { font-weight: 600; }
main h1 { font-size: 30px; }
main h2, .next h2, .featured h2, .address, .call h2, .call a { font-size: 24px; }
main h3, .hero p { font-size: 18px; }
main h4 { font-size: 18px; }
main ul, main ol { padding-left: 25px; }
main li, footer li { margin: 5px 0; }
.nolist, .address ul, .contact ul, footer ul, .news .blogsidebar ul { list-style: none; padding-left: 0; }
.about .video, .contact > .grid { padding: 50px 0; }
.about .btn { margin: 20px 40px 0 0; }
.about iframe { border: 1px solid #eee; }
.outside { margin-left: -400px; }
.shape { width: 700px; height: 700px; float: left; margin: 40px; shape-outside: circle(50%); }
.shape img{width:100%;height:100%;object-fit:cover;border-radius:1000px;transform:scaleX(-1)}
.mt40 { margin-top: 40px; }
.comments p { font-weight: bold; padding-left: 100px; padding-right: 100px; }
.solutions .grid img { display: block; width: 100%; height: 400px;position:unset }
.solutions .grid h3 { margin-top: 0; }
.solutions .grid ul { padding-bottom: 0; margin-bottom: 10px; }
.solutions .grid.half:nth-of-type(odd) div:last-of-type { padding-left: 40px; }
.solutions .grid.half:nth-of-type(odd) img { border-radius: 0 5px 5px 0; }
.solutions .grid.half:nth-of-type(even) div:last-of-type { padding-right: 50px; }
.solutions .grid.half:nth-of-type(even) img { border-radius: 5px 0 0 5px; order: 2; }
.solutions .grid.half:first-of-type { padding-top: 40px; }
.solutions .grid.half:last-of-type { padding-bottom: 40px; }
.news .blogsidebar h3 { margin-top: 45px; }
.news .post { padding: 20px 0; border-color: #eee; }
.contact .grid div { padding: 0 40px }
.contact .grid div:nth-of-type(2) { border-left: 1px solid #eee; border-right: 1px solid #eee; }
.contact h3 { margin-bottom: 0; }

/*INTERMEDIA*/
.intermedia img:nth-of-type(1) {width: 360px; margin-bottom: 20px;}
.intermedia h2 {text-align: center; padding-left: 14%; padding-right: 14%; padding-top: 50px; padding-bottom:20px;}
.intermedia div div p {text-align: center;}
.intermedia .mid div p {text-align: left;}
.intermedia h3 {color:#094891; text-align: center;}
.intermedia h2:nth-of-type(1) {font-size: 26px;}
.left h3 {text-align: left;}
.intermedia iframe {display: block; margin:0 auto; width:700px;}
.intermedia .learn img {height: 100px; width: 240px;}
.intermedia .light div {background-color: #f5f5f5; padding: 5px; margin:5px;}




/* SOLUTION - MANAGED IT */
.microsoftbkg { color: #fff; padding: 20px;box-sizing:border-box }
.microsoftbkg a { height: unset; }
.microsoftbkg .btn { min-width: 190px; }
.microsoftbkg a:before { background-image: none; }

/* SOLUTION - PS-MSP */
.mspbenefits div { background-color: #094891; color: #fff; border-radius: 0 10px 10px 0; padding: 3%; margin: 3% 0; }
.mspbenefits h3 span { background-color: #fff; border-radius: 50%; width: 50px; height: 50px; display: inline-block; text-align: center; vertical-align: middle; font-size: 30px; color: #094891; margin-right: 1%; }

/* SOLUTION - PS-CISCO-MERAKI */
.software { margin: 5% 0; }
.software .grid.third div:nth-child(4), .software .grid.third div:nth-child(5) { border-right: 1px solid #eee; }
.software .grid.third div:nth-child(4), .software .grid.third div:nth-child(5), .software .grid.third div:nth-child(6) { padding: 0 3%; }
.software .grid.half div, .software .grid.third div { align-content: center; justify-items: center;; }
.magicbehind { background: var(--primary, #ca3926); border-radius: 5px; color: #fff; padding: 3%; margin-top: 5%; }

/* SOLUTION - PS-SECURITY */
.secaascheck .grid.third div { border-right: 1px solid #eee; padding: 0 3%; }
.secaascheck .grid.third div:last-child { border: none; }
.secaas .grid.third div { background: #eee; border-radius: 10px; padding: 10% 5%; }
.ctopointer { margin: 3% 0; }
.ctopointer .grid.half div { padding: 5%; }
.ctopointer .grid.half div:nth-child(1) { background-color: #eee; border-radius: 0 50px 50px 0; }

/* SOLUTION - PS-SOFTWARE-LICENSING */
.softwareUpgrades { margin: 5% 0; }
.softwareUpgrades .grid.third div { padding: 5%; }
.softwareUpgrades .grid.third div:nth-of-type(odd) { background-color: #094891; color: #fff; }
.softwareUpgrades .grid.third div:nth-of-type(odd) svg { stroke: #fff; }
.cto { background-color: #eee; padding: 1% 3%; }
.smartalt div svg { display: grid; }

/* ps-disaster-recovery */
.threatrec { margin: 5% 0; }
.threatrec .grid.third div { border-right: 1px solid #eee; padding: 0 3%; }
.threatrec .grid.third div:last-child { border: none; }
.identifyplan { padding: 3%; background-color: #eee; border-radius: 10px; }

@media(max-width:999px) {
    .top { background-color: #ca3926; text-align: center; background-image: unset; }
    header .grid { grid-template-columns: 1fr; grid-template-areas: "logo" "social" "nav"; }
    nav li:last-of-type {margin-left: 5px;}
    .logo div { padding-left: 35%; }
    .next img { margin-left: 0; }
    nav li { margin: 5px; padding: 10px 15px; }
    nav ul { text-align: center }
    nav .top li { margin: 0 0 5px 5px; }
    .hero h1 { text-align: center; }
    .hero .btn { margin: 5px 0; }
    .featured .grid.third { grid-template-columns: 1fr 1fr; }
    footer .call { position: unset; }
}

@media(max-width:900px) {
    .logo div { padding-left: 30%; }
    .hero p { text-align: center; }
    .next .grid { grid-template-columns: 1fr; }
    .next .grid div { padding: 0 35px; }
    footer .grid { grid-template-columns: 1fr 1fr; }
}

@media(max-width:800px) {
    footer .grid.fourth { grid-template-columns: 1fr 1fr 1fr; }
    footer ul, footer h2, footer h3 { padding-left: 25px; }
}

@media(max-width:767px) {
    header .top .wrap { padding: 0 0; }
    header .wrap { padding: 15px 10px; }
    .home > div { padding: 50px 0; }
    .featured .grid > *, .featured .grid > *:before, .featured img { border-radius: unset; }
    .solutions .grid ul { margin-bottom: 20px; }
    .solutions .grid.half:nth-of-type(odd) div:last-of-type { padding-left: 5px; }
    .solutions .grid.half:nth-of-type(even) div:last-of-type { padding-right: 5px; }
    .solutions .grid.half:nth-of-type(even) img { order: unset; }
    .grid.half, .grid.mid, .contact .grid.mid, .featured .grid.third, .address .grid.third { grid-template-columns: 1fr; }
    .grid.fourth { grid-template-columns: 1fr 1fr; }
    footer .grid.fourth div { padding: 0 25px 0 5px; }
    footer p { text-align: center; }
    .subfoot img { margin: 0 auto; }
    .pro > div { margin-left:0 }
    .featured .grid>*{height:300px}
    .featured .grid > *:before { background-image: linear-gradient(rgba(51,51,51,1), rgba(51,51,51,.9), rgba(51,51,51,.7), transparent); }
}

@media(max-width:600px) {
    .top .social { padding: 2px 0 10px 0; }
    .top .social li:last-of-type { margin-right: 0; }
    .logo div { padding-left: 20%; }
    .about .outside { margin-left: 0; }
    .shape { height: auto; }
    
    .imgLeft, .imgRight, .shape { float: none; max-width: 100%; margin: 0 auto; }
    body main .postThumbnail { float: none; width: 100%; max-width: 100%; margin: 0 auto; }
    .grid.half, .grid.third { grid-template-columns: 1fr }
    footer .grid.fourth { grid-template-columns: 1fr 1fr; }
}

@media(max-width:500px) {
    .logo div { padding-left: 5%; }
    .logo div { grid-template-columns: 1fr; }
    .logo p { text-align: center; }
    nav a { text-align: center }
    nav li { margin: 5px; }
    .hero > .banner.wrap p { margin: 20px 20px; }
    body .hero > .wrap { top: unset; transform: unset; padding: 50px 10px; }
    body .hero { height: auto; }
    h1 { text-align: center; }
    .banner .main h1 { font-size: 30px; }
    .banner .main p { font-size: 24px }
    footer .grid.fourth, .grid.fourth { grid-template-columns: 1fr; }
    .comments p { padding-left: 15px; padding-right: 15px; }
    footer h2, footer h3, footer li { text-align: center; }
    footer li { margin: 20px 0 }
    footer ul, footer h2, footer h3 { padding-left: 0; }
    footer .wrap { padding: 0 0; }
    footer .call { padding: 10px 60px 15px; }
    .subfoot .wrap { padding: 20px 10px }
    .subfoot .grid.mid { grid-template-columns: 1fr; }
}

@media(max-width:400px) {
    .banner .main h1, .hero h1 { font-size: 30px; }
    .hero wrap { padding: 0 5px; }
    .home h2, .pro h2, .featured h2 { font-size: 24px; }
    nav li { margin: 5px; }
}