body { font-family: 'Lato', sans-serif; font-size: 14px; background-color: #2a6aac; color: #6b7e8c; line-height: 1.5; text-align: center; min-width: 320px; }
h1, h2, h3, h4, h5, h6, p, th, td, dd, dt, li, blockquote, .left { text-align: left; }
body, header ul, nav ul, section ul, footer ul { padding: 0; margin: 0; }
img, iframe { max-width: 100%;display:block;margin:0 auto }
a img, iframe { border: none; }
a, h1, h2, h3, nav .connect li a:hover { color: #2a6aac; text-decoration: none; }
a:hover { text-decoration: underline; }
header a:hover, nav a:hover, .cycle-slideshow a:hover, .featured a:hover, .solutions h3 a:hover, .banner a:hover, .products a:hover, .btn:hover, footer a:hover { text-decoration: none; }
hr { border-width: 1px; border-color: #eee; border-style: none none solid; margin: 30px 0; }
.products {margin-bottom:10%;}
.hide { display: none }
.table { display: table; width: 100%; }
.table > div { display: table-cell; position: relative; vertical-align: top; }
.table.half > div { width: 49%; }
.table.half > div:nth-of-type(odd) { padding-right: 2%; }
.table.half > div:nth-of-type(even) { padding-left: 2%; }
.table.third > div { width: 32%; }
.table.third > div:nth-of-type(1) { padding-right: 2%; }
.table.third > div:nth-of-type(2) { padding-left: 1%; padding-right: 1% }
.table.third > div:nth-of-type(3) { padding-left: 2%; }
.grid{display:grid;grid-gap:10px 20px}
.mid{align-content:center;align-items:center;vertical-align:middle}
.nowrap { white-space: nowrap; }
.imgRight, .imgLeft { max-width: 50%; border-radius: 3px; }
.imgLeft { float: left; margin: 5px 4% 1% 1%; }
.imgCenter { display: block; margin: 0 auto; }
.imgRight { float: right; margin: 5px 1% 1% 4%; }
.clear { clear: both; }
.center { text-align: center; }
.container { background-color: #fff; }
.wrap {max-width: 1020px;  margin: 0 auto; position: relative; }
.bgimg{position:relative}
.bgimg>img:first-of-type{position:absolute;width:100%;height:100%;left:0;right:0;top:0;bottom:0;object-fit:cover;z-index:0}
/* header */
.top { font-size: 0; }
.top:after { content: ""; width: 50%; height: 42px; position: absolute; top: 46px; right: 0; background-color: #2a6aac;z-index:0 }
nav ul, nav li, .featured a, .products a, .halfCol, .triCol, .quadCol { display: inline-block; vertical-align: top; }
header { z-index:999;position:relative }
header a{display:block}
header .wrap{background-color: #fff;}
header .grid{grid-template-columns:256px 1fr;grid-gap:10px 40px}
nav { font-size: 12px; font-weight: bold; text-transform: uppercase;padding-bottom:40px}
nav li{vertical-align:middle}
nav .connect { font-size: 14px; text-transform: none; margin: 8px 0 7px; text-align: right; }
nav .connect i{display:block;width:18px;height:14px}
nav .connect li:nth-of-type(1), nav .connect li:nth-of-type(2) { padding-right: 10px; margin: 0 5px; border-right: 1px solid #6b7e8c; }
nav .connect li:nth-of-type(2) { display: none; }
nav .connect li a { color: #6b7e8c;margin:5px }
nav .menu { background-color: #2a6aac;display:flex;justify-content:space-between;padding-left:20px }
nav .menu li a { color: #fff; padding: 6px;margin:6px;display:block }
nav .menu a:hover, .cycle-slideshow a:hover span, .featured a:hover h2, footer a:hover, #quick .btn:hover { color: #ddd; }
.chat { position: relative; font-weight: bold; text-transform: uppercase; z-index: 999; }
.chat a { position: fixed; top: 50%; right: 0; background-color: rgba(54,137,222,.95); color: #fff; padding: 15px 50px 15px 20px; box-shadow: -2px 2px 5px rgba(0,0,0,.3); animation: 2s chat-in }
.chat a:hover { text-decoration: none; background-color: rgba(60,152,247,.95); transition: all .3s linear .01s; }
.chat i { margin-right: 10px; }
.cycle-slideshow { min-height: 375px; display: block; overflow: hidden; position: relative; }
.cycle-slideshow a { height: 375px; display: block; color: #fff; background-position: 75% 50% }
.cycle-slideshow .wrap { text-align: left; padding: 0 60px; }
.cycle-slideshow h1, .cycle-slideshow p { max-width: 400px; text-shadow: 1px 1px 1px rgba(0,0,0,.8); }
.cycle-slideshow h1 { font-size: 32px; color: #fff; margin: 0; padding-top: 100px; }
.cycle-slideshow p { font-size: 20px; line-height: 110%; margin-bottom: 20px; }
.cycle-slideshow .btn { font-size: 16px; text-transform: uppercase; color: #fff; padding: 15px 60px; border: 1px solid #fff; }
.cycle-slideshow a:hover span, #quick .btn:hover { border: 1px solid #ddd; }
.cycle-prev, .cycle-next { position: absolute; top: 0; width: 6%; opacity: .8; z-index: 800; height: 100%; cursor: pointer; display: none; /* hiding until there's more than 1 slide */ }
.cycle-prev { left: 0; background: url(/images-design/previous.png) 50% 50% no-repeat; }
.cycle-next { right: 0; background: url(/images-design/next.png) 50% 50% no-repeat; }
.cycle-prev:hover { background: url(/images-design/previous-hover.png) 50% 50% no-repeat; }
.cycle-next:hover { background: url(/images-design/next-hover.png) 50% 50% no-repeat; }
.cycle-slideshow > div { width: 100%; height: 100%; background-repeat: no-repeat; }
.slide1 { background-image: url(/images-design/slides/1.jpg); background-size: cover; }
.featured a { width: 32%; height: 200px; margin-top: 20px; margin-bottom: 20px; position: relative; background-size: cover }
.featured h2 { font-size: 18px; text-align: center; color: #fff; text-shadow: 1px 1px 1px rgba(0,0,0,.8); position: absolute; bottom: 0; text-align: center; width: 100%; }
.featured .feat1 { background-image: url(/images-content/feat1.jpg); background-position: 47% 10%; }
.featured .feat2 { background-image: url(/images-content/feat2.jpg); margin: 20px 1.5%; background-position: 70% 55% }
.featured .feat3 { background-image: url(/images-content/feat3.jpg); background-position: 75% 100%; }
.solutions, .news { margin: 30px 0; }
.solutions li a, .news { font-size: 16px; }
.solutions h2, .news h2 { font-size: 24px; text-align: center; }
.solutions h2 span, .news h2 span { display: block; font-size: 16px; color: #6b7e8c; margin-top: 5px; }
.solutions h2 span:before, .news h2 span:before { content: ""; position: absolute; left: 0; width: 100%; height: 1px; background-image: linear-gradient( to right, #eee, transparent, transparent, #eee ); }
.solutions, .solutions h3 { color: #6b7e8c; }
.solutions .table > div { background-color: #f7f7f7; color: #6b7e8c; padding: 40px 4% 60px !important }
.solutions .table > div:nth-of-type(1) { border-right: 10px solid #fff }
.solutions .table > div:nth-of-type(2) { border-left: 10px solid #fff }
.solutions h3 { font-size: 20px; text-align: center; text-transform: uppercase; margin-top: 0; }
.solutions ul { margin: 20px 0 40px; }
.solutions li { list-style: none; margin: 0 0 15px 0; }
.solutions li i { margin-right: 5px;display:inline-block;width:28px;height:16px }
.solutions li a { font-weight: bold; display: block; margin-bottom: 5px; }
.solutions .btn { color: #2a6aac; position: absolute; bottom: 30px; right: 40px; border: 1px solid #2a6aac; }
.news table { padding: 20px 40px; border: 1px solid #ddd; }
.news td:first-of-type { width: 32%; min-width: 220px; border-right: 1px solid #ddd; }
.news td:last-of-type { padding-left: 40px; }
.news h3 { color: #2a6aac; text-transform: uppercase; line-height: 140%; padding-right: 2%; }
.news a:hover { text-decoration: none; }
.news h3 span { display: block; font-weight: normal; text-transform: none; color: #6b7e8c; }
.news .more { margin-top: 60px; }
.banner { height: 350px; text-align: left; background-image: url(/images-design/banner.jpg); background-color: #222; background-position: center; background-repeat: no-repeat; padding: 0 1%; }
.banner a { height: 350px; }
.banner a:hover span { color: #ddd; border: 1px solid #ddd; }
.banner p, .banner strong, .banner span, footer .best { color: #fff; }
.banner strong, .banner p { max-width: 310px; }
.banner strong { display: block; font-size: 24px; margin-top: 0; padding-top: 80px; }
.banner p { font-size: 16px; margin-bottom: 30px; }
.banner .btn { border: 1px solid #fff; }
section h1 { margin-bottom: 40px; }
section { padding: 20px 1% 40px }
.pad{padding-left:1%;padding-right:1%}
section h1:after { content: ""; display: block; width: 100%; height: 1px; background-image: linear-gradient( to right, transparent, #eee, #ddd ); }
section h2, section h3 { margin-top: 25px; }
section li { margin: 0 0 5px 20px; }
h1 { font-size: 24px; }
h2 { font-size: 18px; }
h3 { font-size: 16px; }
.halfCol { width: 49%; }
.triCol { width: 33%; }
.quadCol { width: 24%; }
.btn { display: inline-block; text-transform: uppercase; color: #2a6aac; padding: 10px 50px; margin-top: 10px; border: 1px solid #2a6aac; }
.btn:hover, .solutions h3 a:hover, .products a:hover h2 { color: #3484d6; }
.btn:hover { cursor: pointer; border: 1px solid #3484d6; }
.btn:hover, form input[type=submit]:hover { cursor: pointer; }
.products a { width: 47%; color: #6b7e8c; margin-top: 20px; margin-bottom: 20px; }
.products a:nth-of-type(odd) { margin-right: 2%; }
.products a:nth-of-type(even) { margin-left: 2%; }
.products h2 { padding-bottom: 10px; margin: 10px 0; border-bottom: 1px solid #eee; }
.products p { margin-top: 0; }
iframe.map { width: 100%; height: 495px; margin-top: 14px; }
iframe.zultys { width: 100%; height: 572px; }
iframe.ctap { width: 534px; height: 300px; }
form { margin: 20px 0 0; }
form input[type=text], form input[type=email], form input[type=tel], form input[type=submit], form textarea { font-family: 'Lato', sans-serif; font-size: 14px; display: block }
form input[type=text], form input[type=email], form input[type=tel], form textarea { width: calc(100% - 22px); padding: 10px; margin-bottom: 15px; border: 1px solid #eee; }
input[type=submit] { width: 100%; padding: 10px; text-align: center; }
form textarea { height: 65px; padding-top: 10px; }
form .btn { background-color: #fff; border: 1px solid #2a6aac; }
form dd { padding-bottom: 20px }
#quick { text-align: right; }
#quick .btn { color: #fff; background-color: #2a6aac; border: 1px solid #fff; }
#contact { text-align: left; }
footer, footer a { color: #fff; }
footer .wrap { padding: 40px 0; }
footer strong { font-size: 16px; }
footer .quadCol:first-of-type { text-align: left; }
footer li { list-style: none; line-height: 190%; margin: 0; }
footer hr { border: none; border-bottom: 1px solid #3079c4; }
footer .halfCol:last-of-type p { text-align: right; }
.a8bmark img{margin-right:0}
.company .table.half, .company .table.half > div { display: block; width: auto }
.company a.map { height: 100px; width: 92%;object-position: 70% 40%;display:block;object-fit:cover }
.company a.map span { position: absolute; bottom: -20px }
form label { text-align: left; display: block; }
form select { text-align: left; display: block; margin-bottom: 15px; font-family: 'Lato', sans-serif; font-size: 14px; }
.tri-ed ul { padding-left: 30px }
.bestit h2 { clear: both }
section > h1 { background-color: #fff; z-index: 999; position: relative }
section h1:after { z-index: 888 }
.bestit a { width: 250px }
.define:hover { cursor: pointer }
.define { text-decoration: underline #2A6AAC }
div.news h6.pr { display: none; }
div.news div.table.half div p.more { margin-left: 25%; }
.subnav { margin-bottom: 40px; }
.videohalf { width: 480px; height: 270px; }
.margintop{margin-top: 20px;}

@media(max-width:999px) {
    .top:after { display: none; }
    nav .menu ul:last-child li:last-child { margin-right: 4px; }
}

@media(max-width:767px) {
    .chat { display: none; }
    nav .connect li:nth-of-type(2) { display: inline-block; }
}
@media(max-width:700px) {
    header .grid{grid-template-columns:1fr}
    nav .connect{text-align:center}
    header{padding-top:10px}
    nav{padding-bottom:0}
    nav .menu{padding-left:0;}
    nav .menu ul:first-of-type{width:100%;display:flex;justify-content:space-evenly}
}

@media(max-width:600px) {
    nav .connect { text-align: center; margin: 12px 0 }
    footer .wrap, section,.pad { padding-left: 2%; padding-right: 2%; }
    footer .wrap{ padding-top: 20px; padding-bottom: 20px; }
    footer .quadCol { display: block; width: auto; margin-bottom: 30px }
    .footnav { text-align: left; }
    .footnav li { display: inline-block; width: 32% }
    .footnav a { display: block; }
    .featured a { display: block; height: 225px; width: auto; margin: 20px 0 !important; }
    .featured h2 { font-size: 26px }
    .table.half, .table.half > div { display: block; width: auto; padding: 0; margin: 12px 0 }
    .solutions .table > div { border: none !important; margin: 20px 0 }
    .news table, .news td { display: block; width: auto !important; border: none !important; padding: 0 2% !important }
    .news .more { margin-top: 1em }
    .cycle-slideshow .wrap, .banner .wrap { padding: 0 2%; top: 50%; transform: translateY(-50%) }
    .cycle-slideshow h1 { padding-top: 0; }
    .company .table.half { display: table; width: 100%; }
    .company .table.half > div { display: table-cell; width: 49% }
    iframe.map { height: 300px }
    .company a.map { height: 125px; }
    .company a.map span { bottom: 0; }
    .banner h2 { padding-top: 0; }
    .banner { height: 250px; background-position: 73% 0; }
    .banner h2, .banner p,.banner strong { text-shadow: 0 0 4px #000,0 0 20px #000 }
    .products a { width: 100%; margin: 12px auto !important; }
    .solutions .btn{left:50%;transform:translateX(-50%);right:unset}
    div.news div.table.half div p.more{margin:1em auto;text-align:center}
}

@media(max-width:500px) {
    h1 ~ .imgRight, .bestit a { float: none; max-width: 100%; margin: 12px 0 }
    .bestit { padding: 0; margin: 0; list-style-type: none }
    .bestit li { margin: 5px 0 }
    .bestit a { display: block; width: auto }
    .featured .bgimg>img:first-of-type{height:225px}
}

@media(max-width:400px) {
    .cycle-slideshow h1 { font-size: 28px }
    .cycle-slideshow .wrap, .cycle-slideshow p, .cycle-slideshow h1 { text-align: center; }
    .banner h2, .banner p,.banner strong { max-width: none; text-align: center; }
    footer .halfCol p{text-align: center !important}
    .company p strong span { display: block; }
    .company a.map span { bottom: 12px; }
    .footnav li { width: 49%; }
    footer .halfCol{display:block;width:auto}
    nav ul{display:block}
    nav .connect li{border:none !important;text-align:center;padding:0 !important;margin:0 !important}
    nav .connect li:first-of-type,nav .menu ul,nav .menu{display:block !important}
        nav .menu li{display:inline-block;width:49%;text-align:center}
        .a8bmark img{margin:0 auto}
}