img, iframe {max-width: 100%; height: auto} html,body{-webkit-text-size-adjust:100%;text-size-adjust:100%} body { font-family: 'Montserrat', sans-serif; font-size: 18px; background-color: #2878b5; color: #4d4d4d; line-height: 1.5; text-align: center; } h1, h2, h3, h4, h5, h6, p, th, td, dd, dt, li, blockquote { text-align: left; } body, header ul, .subnav ul, .partners { padding: 0; margin: 0; } img, iframe { max-width: 100%; display: block } a img, iframe { border: none; } a { transition: ease-out .3s; } a, .phone:hover, .subnav a:hover, .cta a:hover, footer a:hover { text-decoration: none; color: #7dad33; } .phone, nav a:hover, .subnav a, .solutions a:hover > span { text-decoration: none; color: #2878b5; } a:hover { text-decoration: underline; transition: ease-in .3s; } header a:hover, .cycle-slideshow a:hover, .solutions a:hover, .business a:hover { text-decoration: none; } hr { border-width: 1px; border-color: #eee; border-style: none none solid; margin: 30px 0; } .imgLeft, .imgRight { max-width: 45%; } .imgLeft { float: left; margin: 5px 4% 1% 0; } .imgCenter { display: block; margin: 40px auto; } .imgRight { float: right; margin: 5px 0 1% 4%; } .clear { clear: both; } .center { text-align: center; } .hide { display: none; } .nowrap { white-space: nowrap; } .container { background-color: #fff; } .pad { padding-left: 10px; padding-right: 10px } .wrap { max-width: 1100px; display: block; margin: 0 auto; position: relative; } .table { display: table; width: 100%; } .table.pad { padding-left: 10px; padding-right: 10px; width: calc(100% - 20px) } .table.mid > div { vertical-align: middle } .table > div { display: table-cell; vertical-align: top; } .table.half > div { width: 50%; } .table.half > div:first-of-type { padding-right: 4%; } .table.half > div:last-of-type { padding-left: 4%; } .table.third > div { width: 33%; } .table.third > div:nth-of-type(1) { padding-right: 4%; } .table.third > div:nth-of-type(2) { padding: 0 2%; } .table.third > div:nth-of-type(3) { padding-left: 4%; } .table.quad > div { width: 25%; } .grid { display: grid; } .grid.half { grid-template-columns: repeat(2,1fr) } .grid.third { grid-template-columns: repeat(3,1fr) } .grid.quad { grid-template-columns: repeat(4,1fr) } header .table > div, .intro .table > div, .partners img, footer .table > div { vertical-align: middle; } header li, .subnav li, .social li, .business a, .awards img, .awards div { display: inline-block; } .bgimg { position: relative } .bgimg > img:first-of-type { position: absolute; width: 100%; height: 100%; inset: 0; object-fit: cover; z-index: 0 } .social { margin: 10px 0; } .social a{display:block} .social .fa { color: #fff; margin: 4px; width: 23px; height: 18px;display:block } .fa-wordpress { background-color: #464646; } .fa-facebook { background-color: #3b5998; } .fa-twitter { background-color: #1da1f2; } .fa-linkedin { background-color: #00a0dc; } .fa-google-plus { background-color: #dd4b39; } header { font-weight: bold; padding: 20px 10px; } header .table > div:nth-of-type(1), .subnav { text-align: left; } header .table > div:nth-of-type(1) { width: 250px; } header .table > div:nth-of-type(2) { padding: 0 2%; } header .table > div:nth-of-type(3) { width: 230px; } header .social .fa { padding: 6px 4px; } .logoimg { width: 248px; height: 86px; margin: 0 auto; display: block } nav a { color: #4d4d4d; padding: 5px; display: block } nav .fa-play { font-size: 18px; color: #eee; margin-left: 15px;display:inline-block;width:23px;height:18px } .subnav { line-height: 1; padding: 15px 10px; margin-bottom: 50px; border-bottom: 1px solid #eee; } .subnav li { margin: 5px 5px 5px 0; border-right: 1px solid #999; } .subnav li:last-of-type { border: none; } .subnav li a { margin-right: 10px; } .cycle-slideshow { height: 600px; position: relative; overflow: hidden; } .cycle-slideshow.hero:after{content:"";background-color:rgba(0,0,0,.5);width:100%;height:100%;position:absolute;inset:0;z-index:1} .cycle-slideshow .bgimg .wrap{position:relative;z-index:2} .hero .bgimg>img:first-of-type{object-position:92% 38%} .cycle-slideshow a, .banner .overlay { background-color: rgba(0,0,0,.5); } .cycle-slideshow a { display: block; width: 100%; height: 100%; background-size: cover; background-position: 75% 50% } .cycle-slideshow .wrap, .banner .wrap { top: 50%; transform: translateY(-50%); } .cycle-slideshow p, .banner p { font-weight: bold; text-align: center; color: #fff; margin: 0 auto; text-shadow: 1px 1px 2px rgba(0,0,0,.5); } .cycle-slideshow p { font-size: 18px; font-weight: normal; } .cycle-slideshow strong { display: block; font-size: 30px; line-height: 1.2; margin-bottom: 20px; } .cycle-slideshow em { font-style: normal; color: #7dad33; } .cycle-slideshow span { display: block; max-width: 250px; margin: 40px auto; background-color: #7dad33; color: #fff; padding: 10px 0; border-radius: 3px; border-bottom: 2px solid #628a29; } .cycle-prev, .cycle-next { position: absolute; top: 0; width: 5%; z-index: 888; height: 100%; cursor: pointer; background-position: 50% 50%; background-repeat: no-repeat; opacity: .2; } .cycle-prev { left: 0; background-image: url(/images-design/arrow-prev.png); } .cycle-next { right: 0; background-image: url(/images-design/arrow-next.png); } .cycle-prev:hover, .cycle-next:hover { opacity: .4; transition: all .3s linear .01s; } .banner { background-size: cover; background-position: center; } .banner .overlay { height: 300px; } .banner p { width: 90%; font-size: 30px; } .banner.about { background-image: url(/images-design/meeting.jpg); } .banner.services { background-image: url(/images-design/technicians.jpg); background-position-y: 40%; } .banner.contact { background-image: url(/images-design/businessmen.jpg); background-position-y: 90%; } .intro h1, .intro, .testimonials, .area, .cta, .cta a { color: #fff; } .intro { background-image: linear-gradient( to right, #73a230 50%, #2878b5 50%); } .intro .wrap { background-color: #2878b5 } .intro h1, .big, .articles h2, .cta h2 { font-size: 30px; } .intro .table > div:first-of-type { width: 300px; background-image: url(/images-design/bg-intro.png); background-repeat: no-repeat; background-position-y: center; background-position-x: -50px; padding: 10px 0; background-size: 100% 100% } .intro .table > div:last-of-type { width: calc(100% - 300px); } h2.big, .testimonials p, .articles h2, .area p { text-align: center; } .partners { background-image:linear-gradient(#ebebeb 910px, #fff 910px);padding:180px 0 0;margin-top:-100px; } .partners>.wrap{max-width:1400px} .partners img { object-fit: contain; filter: grayscale(100%); transition: all 0.5s ease; opacity: 0.3; padding: 3%;margin:0 auto;max-height:80px;width:auto } .partners img:hover { filter: grayscale(0%); opacity: 1; } .partners .grid { grid-template-columns: 1fr 1fr 1fr ;margin: 250px;background-color:#fff;align-items:center;grid-gap:50px clamp(20px, 4vw, 40px);border-radius:100px;padding:40px 0 150px } .partners .bucket{padding-top:150px;background-image: url('images-content/partnerbkg.svg'); background-repeat: no-repeat;background-size:1400px; min-height:1350px; object-position:50% 50%; position: relative; z-index: 1; } #solutions p { margin: 0; text-transform: uppercase; } #solutions a { color: #fff; margin-top: 15px; text-decoration: none; } #solutions .quad div { display: flex; justify-content: center; align-content: center; } .textbkg { display: grid; justify-items: right; } .textbkg p { color: #eeeeee; font-size: 130px; font-weight: bold; letter-spacing: -5px; } .dot { background: #fff; border: 1px solid #7dad33; border-radius: 50%; width: 136px; height: 136px; justify-content: center; align-items: center; position: absolute; top: 120px; z-index: 1; } .dot2 { background-color: #7dad33; border-radius: 50%; font-size: 18px; font-weight: bold; width: 220px; height: 220px; color: #fff; text-transform: uppercase; justify-content: center; align-items: center; } .carousel { height:143px;overflow:hidden } .testimonials, .area { background-color: #2878b5; } .testimonials { padding: 150px 0; position: relative; z-index: 0; margin-top:-150px; } .testimonials p { padding: 0 5%; margin: 15px auto; } .testimonials strong, .articles h2 span { display: block; } .testimonials span { text-transform: uppercase; } .articles, .cta { padding: 40px 0 50px; } .articles h2 span { font-size: 18px; } .area { line-height: 1.7; padding: 10px 0; } .area p { margin: 0 5%; padding-bottom: 10px } .cta { background-color: #4d4d4d; } .cta .table div:nth-of-type(2) { text-align: center } .cta .table div:nth-of-type(2) div { display: inline-block } .cta ul { list-style: none; margin: 40px 0; position: relative; padding-left: 50px } .cta li { margin: 0; } .cta li:first-of-type { position: absolute; top: 10px; left: 0 } section { padding: 0 0 40px; } section h1 { font-size: 30px; color: #2878b5; } section h2 { font-size: 20px; } section h3 { font-size: 18px; } section ul, section ol { padding-left: 35px; padding-right: 10px } section li { margin-bottom: 5px; } section a .fa-play { font-size: 12px; vertical-align: middle; margin-left: 10px; } .btn, .business a > span { display: inline-block; font-weight: bold; background-color: #7dad33; color: #fff; padding: 10px 0; border-radius: 3px; border-bottom: 2px solid #628a29; } .btn { min-width: 250px; } .overflow{overflow:hidden} .business { display: flex; flex-wrap: wrap; width: calc(100% + 10px); margin:0 -5px; font-size: 0; } .business a { flex: 1 1 200px; font-size: 16px; vertical-align: top; background-color: #f5f5f5; color: #4d4d4d; padding: 20px 10px 70px; margin: 5px; position: relative; } .business h2, .business p { text-align: center; } .business i { color: rgba(40,120,181,.3); width: 62px; height: 48px;display:block;margin:0 auto } .business a > span { width: calc(100% - 40px); position: absolute; left: 20px; bottom: 20px; } .logos img { max-height: 80px; max-width:150px; block } .logos li { vertical-align: middle; margin: 1em 45px; display: inline-block } .mission { background-image: url(/images-design/handshake.jpg); background-size: cover; background-position: center; background-color: rgba(0,0,0,.5); background-blend-mode: color; color: #fff; margin: 50px 0 20px; padding: 40px 4%; } .mission h2 { font-size: 30px; } .awards div, .awards img { vertical-align: middle; } .awards div { width: calc(100% - 245px); } .awards img { width: 200px; margin-left: 40px; } .awards div:nth-of-type(3) { width: calc(100% - 295px); } .awards img:nth-of-type(3) { width: 250px; } .awards div:nth-of-type(4) { width: calc(100% - 155px); } .awards img:nth-of-type(4) { width: 110px; } .careers h2 { margin-bottom: 0; } .careers p { margin-top: 0; } .address h2 { padding-left: 60px; } .address ul { list-style: none; position: relative; padding-left: 60px; } .address li:first-of-type { position: absolute; left: 0; top: 5px; } .table.half.address > div:first-of-type { padding-left: 200px; } .map { width: 100%; height: 400px; margin: 40px 0; } .zultys-prodcat { width: 100%; height: 575px; } .h350 { max-height: 350px; } form { margin: 20px 0; } form .table.half > div:first-of-type { padding-right: 5px; } form .table.half > div:last-of-type { padding-left: 5px; } form input[type=text], form input[type=email], form input[type=tel], form input[type=file], form input[type=submit], form select, form textarea { font-family: 'Montserrat', sans-serif; font-size: 16px; } form input[type=text], form input[type=email], form input[type=tel], form input[type=file], form select, form textarea { width: calc(100% - 40px); background-color: #f5f5f5; margin-bottom: 10px; padding: 0 20px; border: none; } form input[type=text], form input[type=email], form input[type=tel] { height: 45px; } form input[type=file], form select { padding: 12px 20px; } form input[type=file] { display: block; margin: 5px 0; } form select { width: 100%; } form textarea { height: 150px; padding: 15px 20px; } form input[type=submit], .business a:hover > span { font-weight: bold; background-color: #2878b5; color: #fff; padding: 10px 0; border-radius: 3px; border-top: none; border-left: none; border-right: none; border-bottom: 2px solid #1d5682; transition: ease-out .3s; } form input[type=submit] { min-width: 250px; font-size: 18px; } form input[type=submit]:hover, .cta #contact input[type=submit] { cursor: pointer; background-color: #7dad33; color: #fff; border-bottom: 2px solid #628a29; transition: ease-in .3s; } form label { text-align: left; display: block; margin-bottom: 10px; } .cta #contact { text-align: left; } .cta #contact textarea { height: 100px; } .cta #contact input[type=submit]:hover { background-color: #fff; color: #7dad33; border-bottom: 2px solid #ddd; } .phnum { display: inline-block; width: 35px } #career .table.half { margin-bottom: 20px; } #support { margin-top: 40px; } .kantech { width: 150px; padding-left: 20px; } footer, footer a { color: #fff; } footer a { display: block } footer .wrap{ padding: 40px 0; } footer .grid { align-items: center } footer ul { list-style: none; padding-left: 0; } footer .third > div:last-of-type li { text-align: right; margin: 20px 0; } footer .social .fa { padding: 6px; } .a8b img, .hippa { display: inline-block } h1, h2, h3, h4, h5, h6, p, form { padding: 0 10px } @media(max-width:999px) { .solutions h3 span { display: block; } header .table > div:nth-of-type(odd) { width: 180px } .address li:first-of-type { display: block; position: relative; text-align: center } .address h2, .address ul { padding: 0; } .address h2 { text-align: center } .address ul { display: inline-block } .address h2, .address ul { margin: 0 } .logoimg { width: 180px; height: 63px } } @media(max-width:767px) { .solutions .grid.third { grid-template-columns: repeat(2,1fr) } .cta input[type=submit] { width: 100% } footer .wrap { padding: 40px 0 20px } footer ul { margin: 0 } footer .grid { display: block } footer li { text-align: center !important } footer .grid div:first-of-type li { width: calc(25% - .25em); display: inline-block } footer a, header .social a { margin: 8px } header .table > div { display: block; width: auto !important; padding: 0 !important; text-align: center !important } header ul { margin: 1em auto } .logoimg { width: 248px; height: 86px } } @media(max-width:700px) { .address h2 { padding: 10px } .address ul { padding: 10px 0 10px 60px } .address li:first-of-type { position: absolute } .address > div { display: block; width: auto !important; padding: 0 !important } .address ul { display: inline-block; width: 250px; } .paging { order: 999 } } @media(max-width:600px) { .solutions .grid.third { grid-template-columns: 1fr; grid-auto-rows: unset } .solutions h3 span { display: inline } .solutions .grid > a { padding: 10px 20px 30px } .solutions a > span { position: relative; bottom: unset; display: block; width: auto; max-width: 300px } .intro h1, .intro p { margin: 20px } .intro .table > div, .mission .table > div { display: block; width: auto !important; padding: 0 !important } .intro .table > div:first-of-type { background: none } .intro h1:after { content: ""; display: block; height: 10px; background-image: linear-gradient(135deg, #73A230 10%, #8AB547 10%, #8AB547 20%, #73A230 20%, #73A230 30%, #8AB547 30%, #8AB547 40%, #73A230 40%, #73A230 50%, #8AB547 50%, #8AB547 60%, #73A230 60%, #73A230 70%, #8AB547 70%, #8AB547 80%, #73A230 80%, #73A230 90%, #8AB547 90%); border-radius: 5px; background-attachment: fixed; margin-top: 5px } .cta .wrap > .table > div { display: block; width: auto; padding: 0 !important } .cta .table div:nth-of-type(2) div { display: block } .cta .table div div ul { display: inline-block; vertical-align: top; width: calc(50% - 50px - .25em); min-width: 180px; margin: 1em auto } section .imgRight { float: none; margin: 1em auto; max-width: 100%; } .cycle-slideshow { height: 350px } .cycle-slideshow strong { font-size: 26px } .cycle-slideshow strong br{display:inline} } @media(max-width:500px) { .intro h1, .ccpaNotice { text-align: center !important } .banner p { font-size: 24px } .banner br { display: none } .big{font-size:28px} } @media(max-width:400px) { footer .grid div:first-of-type li { width: calc(50% - .25em); } .ccpaNotice a { display: block } [type=submit] { width: 100% } }