/* HOMEPAGE 2023 */
.navbar {z-index: 100000;}
.home-container {display: block; float: left; position: relative; z-index: 9999;}

.focus-products {float: left; width: 100%; background: #ffffff; margin-top: 0; padding: 40px 0;}
.focus-products .flex-focus {display: flex; align-content: center; gap: 20px; justify-content: space-between; flex-wrap: wrap;}
.focus-products .flex-focus .focus-box {width: calc(33% - 15px); overflow: hidden; margin-bottom: 10px;}
.focus-products .flex-focus .focus-box img {width: 100%; height: auto; transition: .25s all ease-in-out;}
.focus-products .flex-focus .focus-box:hover img {transform: scale(1.1);}

.home-intro {float: left; width: 100%; background: #eef1f5; padding: 75px 0;}
.home-intro p.subhead {color: #ed702d; font-size: 1.3em; font-weight: 600; padding-bottom: 25px;}
.home-intro h2 {color: #000000; font-size: 2.1em; font-weight: 500; line-height: 115%; padding-bottom: 5px;}
.home-intro p {color: #000000; font-size: 1.05em; line-height: 155%; padding-bottom: 25px;}
.home-intro aside {float: left; width: 100%; padding-left: 20%; margin-top: 50px;}
.home-intro aside .bullet-point {float: left; width: 100%;}
.home-intro aside .bullet-point .icon-holder {float: left; width: 60px; margin-right: 50px;}
.home-intro aside .bullet-point .text-holder {float: left; width: calc(100% - 110px);}
.home-intro aside .bullet-point .text-holder h3 {color: #000000; border-left: 3px solid #ed702d; font-size: 1.1em; font-weight: 600; line-height: 135%; margin-left: -15px; padding: 0 0 0 11px;}
.home-intro.intro1 {float: left; width: 100%; background: #eef1f5; padding: 50px 0; margin-top: -30px;}
.home-intro.intro1 h1 {color: #000000; font-size: 2.6em; text-align: center; font-weight: 500; line-height: 115%; padding-bottom: 0px;}

.industries {float: left; width: 100%; padding: 75px 0; background: url("../images/bg-industries.jpg") no-repeat center center; background-size: cover;}
.industries h2 {color: #ffffff; font-size: 2.6em; font-weight: 500; line-height: 115%; padding-bottom: 5px; text-align: center;} 
.industries p {color: #ffffff; display: block; margin: 0 auto; width: 60%; text-align: center; padding-bottom: 50px;}
.industries .flex-industries {display: flex; align-content: center; gap: 20px; justify-content: space-between; flex-wrap: wrap;}
.industries .flex-industries aside {width: 18%; margin-bottom: 25px; text-align: center;}
.industries .flex-industries aside .icon-holder {display: flex; margin: 0 auto; justify-content: center; align-items: center; width: 130px; height: 130px; border: 3px solid #e96f2d; border-radius: 50%;}
.industries .flex-industries aside h3 {color: #ffffff; font-size: 1.2em; font-weight: 500; line-height: 135%;}
.industries .flex-industries aside h3 a {color: #ffffff;}
.industries .flex-industries aside h3 a:hover {color: #ed702d; text-decoration: none;}

.why-choose {float: left; width: 100%; background: #ffffff; padding: 75px 0;}
.why-choose article {float: left; width: 100%;}
.why-choose article h2 {color: #000000; font-size: 2.6em; font-weight: 500; line-height: 115%; padding-bottom: 5px;}
.why-choose article p {color: #000000; font-size: 1.05em; line-height: 155%; padding-bottom: 25px;}
.why-choose article a.home-btn {display: inline-block; background: #ed702d; padding: 15px 55px 15px 35px; font-size: 1.1em; color: #ffffff; border-radius: 8px; font-weight: 600; position: relative; transition: .25s all ease-in-out;}
.why-choose article a.home-btn:hover {background: #517cce; text-decoration: none;}
.why-choose article a.home-btn::after {font-family: 'Font Awesome 5 Free'; font-weight: 900; content: "\f054"; position: absolute; right: 35px; transition: .25s all ease-in-out;}
.why-choose article a.home-btn:hover::after {right: 30px;}
.why-choose aside {float: left; width: 100%; background: #517cce; border-radius: 10px; padding: 45px;}
.why-choose aside .list {display: block; width: 100%; position: relative; margin-bottom: 15px;}
.why-choose aside .list h3 {color: #ffffff; font-size: 1.3em; font-weight: 600; line-height: 135%; padding-bottom: 2px; margin-bottom: 0px;}
.why-choose aside .list p {color: #ffffff; font-size: 1.05em; line-height: 155%; margin-bottom: 0px; padding-bottom: 15px;}
.why-choose aside .list .splitter {background: linear-gradient(90deg, rgba(177,255,255,1) 0%, rgba(90,165,214,1) 100%); position: absolute; width: 100%; height: 2px; bottom: 0px; left: 0px;}
.why-choose aside .list:last-child {margin-bottom: 0px;}
.why-choose aside .list:last-child p {padding-bottom: 0px;}
.why-choose aside .list:last-child .splitter {display: none;}

.insights {float: left; width: 100%; background: url("../images/bg-case-studies.jpg") no-repeat bottom center; background-size: cover; padding: 75px 0;}
.insights h2 {color: #ffffff; font-size: 2.6em; font-weight: 500; line-height: 115%; padding-bottom: 5px;}
.insights p.link {color: #ffffff; position: relative; font-size: 1.05em; line-height: 155%; padding-bottom: 0px; padding-right: 25px; margin: 20px 0px 0px 0px !important; text-align: right;}
.insights p.link a {color: #ffffff;}
.insights p.link a::after {font-family: 'Font Awesome 5 Free'; font-weight: 900; content: "\f054"; position: absolute; right: 0px; transition: .25s all ease-in-out;}
.insights p.link a:hover::after {right: -5px;}
.insights .news-summary {position: relative; width: 95%; background: #ffffff; height: 260px;margin: 10px 2.5% 20px 2.5%; overflow: hidden;	border: 2px solid #517cce;}
.insights .news-summary .news-img {position: relative; z-index: 6; width: 100%; height: 300px; overflow: hidden;}
.insights .news-summary .news-img img {width: 100%; height: auto;}
.insights .news-summary .news-content {position: absolute; bottom: 0; width: 100%; padding: 0 15px; background: rgba(0,0,0,0.8); z-index: 7;}
.insights .news-summary .news-content h3 {font-size: 1.2em; line-height: 125%;	text-transform: none; padding-bottom: 20px; margin-bottom: 0px;}
.insights .news-summary .news-content h3 a {color: #ffffff;}
.insights .news-summary .news-content h3 a:hover {color: #ffff00;	text-decoration: none;}
.insights .news-summary .news-content .news-detail {max-height: 0; transition: max-height 0.25s ease-out;}
.insights .news-summary:hover .news-content .news-detail {max-height: 500px; transition: max-height 0.25s ease-in;}
.insights .news-summary .news-content .news-detail p {font-size: 14px; color: #ffffff;} 
.insights .news-summary .news-content .news-detail p:first-child {color: #ffffff; padding-bottom: 20px;}
.insights .news-summary .news-content .news-detail .date {width: 110px; display: inline-block;}
.insights .news-summary .news-content .news-detail .date p.meta-date {position: relative; padding-left: 15px; color: #ffffff;	font-size: 12px; padding-bottom: 0px;}
.insights .news-summary .news-content .news-detail .date p.meta-date::before {position: absolute; left: 0px; font-family: 'Font Awesome 5 Free'; font-weight: 900; content: "\f073";}
.insights .news-summary .news-content .news-detail .tags {width: calc(100% - 120px); display: inline-block; padding-left: 10px;} 
.insights .news-summary .news-content .news-detail .tags p.meta-tags {position: relative; padding-left: 20px; color: #ffffff; font-size: 12px; line-height: 18px; padding-bottom: 0px;}
.insights .news-summary .news-content .news-detail .tags p.meta-tags a {color: #ffff00; font-style: italic;} 
.insights .news-summary .news-content .news-detail .tags p.meta-tags::before {position: absolute; left: 0px; font-family: 'Font Awesome 5 Free'; font-weight: 900; content: "\f02c";}
.insights .cs-summary {position: relative; width: 95%; background: #ffffff; height: 260px;margin: 10px 2.5% 20px 2.5%; overflow: hidden;}
.insights .cs-summary .news-img {position: relative; z-index: 6; width: 100%; height: 300px; overflow: hidden;}
.insights .cs-summary .news-img img {width: 100%; height: auto;}
.insights .cs-summary .news-content {position: absolute; bottom: 0; width: 100%; padding: 0 15px; background: rgba(0,0,0,0.8); z-index: 7;}
.insights .cs-summary .news-content h3 {font-size: 1.2em; line-height: 125%;	text-transform: none; padding-bottom: 20px; margin-bottom: 0px;}
.insights .cs-summary .news-content h3 a {color: #ffffff;}
.insights .cs-summary .news-content h3 a:hover {color: #ffff00;	text-decoration: none;}
.insights .cs-summary .news-content .news-detail {max-height: 0; transition: max-height 0.25s ease-out;}
.insights .cs-summary:hover .news-content .news-detail {max-height: 500px; transition: max-height 0.25s ease-in;}
.insights .cs-summary .news-content .news-detail p {font-size: 14px; color: #ffffff;} 
.insights .cs-summary .news-content .news-detail p:first-child {color: #ffffff; padding-bottom: 20px;}
.insights .cs-summary .news-content .news-detail .date {width: 110px; display: inline-block;}
.insights .cs-summary .news-content .news-detail .date p.meta-date {position: relative; padding-left: 15px; color: #ffffff;	font-size: 12px; padding-bottom: 0px;}
.insights .cs-summary .news-content .news-detail .date p.meta-date::before {position: absolute; left: 0px; font-family: 'Font Awesome 5 Free'; font-weight: 900; content: "\f073";}
.insights .cs-summary .news-content .news-detail .tags {width: calc(100% - 120px); display: inline-block; padding-left: 10px;} 
.insights .cs-summary .news-content .news-detail .tags p.meta-tags {position: relative; padding-left: 20px; color: #ffffff; font-size: 12px; line-height: 18px; padding-bottom: 0px;}
.insights .cs-summary .news-content .news-detail .tags p.meta-tags a {color: #ffff00; font-style: italic;} 
.insights .cs-summary .news-content .news-detail .tags p.meta-tags::before {position: absolute; left: 0px; font-family: 'Font Awesome 5 Free'; font-weight: 900; content: "\f02c";}
.insights .bx-wrapper {position: relative; margin: 0; width: 100%; max-width: 1140px !important; padding: 0; height: auto;}
.insights .bx-wrapper .bx-prev {left: -65px; background: url(../images/control-arrow.png) no-repeat top left; transition: .25s all ease-in-out;}
.insights .bx-wrapper .bx-next {right: -65px; background: url(../images/control-arrow.png) no-repeat top right; transition: .25s all ease-in-out;}
.insights .bx-wrapper .bx-prev:hover {opacity: 0.8; left: -70px;}
.insights .bx-wrapper .bx-next:hover {opacity: 0.8; right: -70px;}

.cta-banners {float: left; width: 100%; padding: 75px 0 50px 0;}
.cta-banners .flex-banners {display: flex; align-content: center; gap: 20px; justify-content: space-between; flex-wrap: wrap;}
.cta-banners .flex-banners article {width: 48%; padding: 50px 50px 130px 50px; position: relative;}
.cta-banners .flex-banners article img.cta-icon {position: absolute; top: 25px; right: 25px;}
.cta-banners .flex-banners article h2 {color: #ffffff; font-size: 2.6em; font-weight: 500; line-height: 115%; margin: 0; padding: 0 130px 25px 0;}
.cta-banners .flex-banners article a.cta-btn {display: inline-block; background: #ffffff; padding: 15px 55px 15px 35px; font-size: 1.1em; color: #000000; border-radius: 8px; font-weight: 600; position: absolute; left: 50px; bottom: 50px; transition: .25s all ease-in-out;}
.cta-banners .flex-banners article a.cta-btn:hover {background: #000000; color: #ffffff; text-decoration: none;}
.cta-banners .flex-banners article a.cta-btn::after {font-family: 'Font Awesome 5 Free'; font-weight: 900; content: "\f054"; position: absolute; right: 35px; transition: .25s all ease-in-out;}
.cta-banners .flex-banners article a.cta-btn:hover::after {right: 30px;}
.cta-banners .flex-banners article p {color: #ffffff; font-size: 1.05em; line-height: 155%; padding-right: 50px;}

/* FOCUS PRODUCTS */
.focus-container {display: block; float: left; position: relative; z-index: 9999;}
.focus-header {float: left; width: 100%; background: #ffffff; margin-top: -30px;}
.focus-header img {width: 100%; height: auto; display: block;}

.focus-intro {float: left; width: 100%; background: #ffffff; padding: 75px 0 40px 0;}
.focus-intro article {float: left; width: 100%;}
.focus-intro article h1 {color: #000000; font-size: 3.4em; font-weight: 700; line-height: 115%; margin: 0; padding-bottom: 35px;}
.focus-intro article h2 {color: #000000; font-size: 3.4em; font-weight: 700; line-height: 115%; margin: 0; padding-bottom: 35px;}
.focus-intro article h3 {color: #000000; font-size: 1.7em; font-weight: 500; line-height: 135%; margin: 0; padding-bottom: 25px;}
.focus-intro article h3 em {font-style: normal; color: #517ece;}
.focus-intro article p {color: #000000; font-size: 1.05em; line-height: 155%; margin: 0; padding-bottom: 10px;}
.focus-intro article ul {margin-left: 20px; padding-bottom: 10px; list-style: disc;}
.focus-intro article ul li {color: #000000; font-size: 1.05em; line-height: 155%;}
.focus-intro aside {float: left; width: 90%; margin-left: 10%;}
.focus-intro aside img {float: left; width: auto; max-width: 100%; height: auto;}
.focus-intro a.btn {display: inline-block; color: #517ece; font-size: 1.05em; line-height: 155%; margin: 10px 0 0 0; position: relative; padding: 5px 45px 7px 0; transition: all .25s ease-in-out;}
.focus-intro a.btn:hover {color: #ed702d;}
.focus-intro a.btn.btn-guide::after {font-family: 'Font Awesome 5 Free'; font-weight: 900; content: "\f144"; font-size: 1.3em; position: absolute; right: 15px; top: 50%; transform: translateY(-50%); transition: right .25s ease-in-out;}
.focus-intro a.btn.btn-guide:hover::after {right: 11px;}
.focus-intro a.btn.btn-docs-open::after {font-family: 'Font Awesome 5 Free'; font-weight: 900; content: "\f358"; font-size: 1.3em; position: absolute; right: 15px; top: 50%; transform: translateY(-50%); transition: right .25s ease-in-out;}
.focus-intro a.btn.btn-docs-open:hover::after {right: 11px;}
.focus-intro a.btn.btn-docs-close::after {font-family: 'Font Awesome 5 Free'; font-weight: 900; content: "\f35b"; font-size: 1.3em; position: absolute; right: 15px; top: 50%; transform: translateY(-50%); transition: right .25s ease-in-out;}
.focus-intro a.btn.btn-docs-close:hover::after {right: 11px;}

.slider-focus .bx-wrapper .bx-controls-direction a {position: absolute; top: auto; bottom: 10px; outline: 0; width: 32px; height: 32px; text-indent: -9999px; z-index: 4; transition: all .25s ease-in-out;}
.slider-focus .bx-wrapper .bx-next {right: -70px; background: url("../images/control-arrow-focus.png") no-repeat top right;}
.slider-focus .bx-wrapper .bx-prev {right: -32px; left: auto; background: url("../images/control-arrow-focus.png") no-repeat top left;}
.slider-focus .bx-wrapper .bx-next:hover {opacity: 0.7;}
.slider-focus .bx-wrapper .bx-prev:hover {opacity: 0.7;}

.focus-intro .documentation {float: left; width: 100%;}
.focus-intro .documentation .documents {display: none;}
.focus-intro .documentation table.tbl-documents {width: 100%; margin: 20px 0;}
.focus-intro .documentation table.tbl-documents tr td:nth-child(1) {width: 66%;}
.focus-intro .documentation table.tbl-documents tr td:nth-child(2) {width: 17%;}
.focus-intro .documentation table.tbl-documents tr td:nth-child(3) {width: 17%;}
.focus-intro .documentation table.tbl-documents tr td img {height: 25px; width: auto;}

.stats-benefits {float: left; width: 100%; background: #eef1f5; padding: 75px 0 40px 0;}
.stats-benefits article.key-stats {float: left; width: 100%; margin-bottom: 35px;}
.stats-benefits article.key-stats .image {float: left; width: 180px; height: 180px; margin-right: 60px;}
.stats-benefits article.key-stats .image img {width: 100%; height: 100%;}
.stats-benefits article.key-stats h3 {color: #000000; font-size: 2.6em; font-weight: 600; line-height: 135%; margin: 0; padding-bottom: 20px;}
.stats-benefits article.key-stats h3 em {font-style: normal; color: #517ece;}
.stats-benefits article.key-stats .stats {float: left; width: calc(100% - 242px); display: flex; align-content: flex-end; align-items: flex-end; gap: 0px 60px; flex-wrap: wrap;}
.stats-benefits article.key-stats .stats .stat {margin-bottom: 0px; margin-top: 5px;}
.stats-benefits article.key-stats .stats .stat p {color: #517ece; font-size: 1.1em; font-weight: 500; line-height: 135%; margin: 0; padding: 0;}
.stats-benefits article.key-stats .stats .stat h4 {color: #000000; font-size: 1.6em; font-weight: 700; line-height: 85%; margin: 0; padding: 20px 0 8px 0;}
.stats-benefits article.key-stats .stats .stat h4 span {font-size: 2.3em;}

.stats-benefits article.benefits-list h3 {color: #000000; font-size: 1.7em; font-weight: 500; line-height: 135%; margin: 0; padding-bottom: 25px;}
.stats-benefits article.benefits-list h3 em {font-style: normal; color: #517ece;}
.stats-benefits article.benefits-list ul {margin: 0; list-style: none; padding: 0; -moz-column-count: 3; -webkit-column-count: 3; column-count: 3;}
.stats-benefits article.benefits-list ul li {color: #000000; font-size: 1.05em; position: relative; padding-left: 25px; padding-right: 50px; line-height: 155%; margin: 0; padding-bottom: 10px; break-inside: avoid-column;}
.stats-benefits article.benefits-list ul li::before {color: #ed702d; position: absolute; top: 0; left: 0; font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f058";}
.stats-benefits article.benefits-list p {color: #000000; font-size: 1.05em; line-height: 155%; margin: 0; padding-bottom: 10px;}

.which-product {float: left; width: 100%; background: #ffffff; padding: 75px 0;}
.which-product h2 {color: #000000; font-size: 3.0em; font-weight: 700; line-height: 115%; margin: 0; padding-bottom: 35px; text-align: center;}
.which-product a.btn-guide {display: block; background: #ed702d; width: 325px; padding: 15px 55px 15px 35px; margin: 0 auto 45px auto; font-size: 1.1em; color: #ffffff; border-radius: 8px; font-weight: 500; position: relative; transition: .25s all ease-in-out;}
.which-product a.btn-guide:hover {background: #517cce; text-decoration: none;}
.which-product a.btn-guide::after {font-family: 'Font Awesome 5 Free'; font-weight: 900; content: "\f054"; position: absolute; right: 35px; transition: .25s all ease-in-out;}
.which-product a.btn-guide:hover::after {right: 30px;}
.which-product a .product-detail {padding: 0 5% 25px 5%;}
.which-product a .product-detail h3 {color: #517ece; font-size: 1.7em; text-align: center; font-weight: 500; line-height: 135%; margin: 0; padding-bottom: 35px;}
.which-product a .product-detail img {display: block; margin: 0 auto; width: auto; max-width: 95%; height: auto; transition: .25s all ease-in-out;}
.which-product a:hover .product-detail img {opacity: 0.7;}
.which-product a:hover {text-decoration: none !important;}

.slider-which .bx-wrapper .bx-controls-direction a {position: absolute; top: auto; bottom: -10px; margin-top: 0px; outline: 0; width: 32px; height: 32px; text-indent: -9999px; z-index: 4; transition: all .25s ease-in-out;}
.slider-which .bx-wrapper .bx-next {left: 50%; transform: translateX(-50%); margin-left: 20px; background: url("../images/control-arrow-focus.png") no-repeat top right;}
.slider-which .bx-wrapper .bx-prev {left: 50%; transform: translateX(-50%); margin-left: -20px; background: url("../images/control-arrow-focus.png") no-repeat top left;}
.slider-which .bx-wrapper .bx-next:hover {opacity: 0.7;}
.slider-which .bx-wrapper .bx-prev:hover {opacity: 0.7;}

.product-range {float: left; width: 100%; padding: 75px 0;}
.product-range article {float: left; width: 100%; padding: 50px 75px; background: rgba(0,0,0,0.5); border: 2px solid #ff6600; box-shadow: 0px 0px 15px 2px rgba(255,102,0,1); border-radius: 5px;}
.product-range article h2 {color: #ffffff; font-size: 2.6em; font-weight: 700; line-height: 115%; margin: 0; padding-bottom: 35px;}
.product-range article .cat-container {display: flex; flex-wrap: wrap; gap: 25px 20px;}
.product-range article .cat-container .category-range {float: left; width: calc(50% - 20px);}
.product-range article .cat-container .category-range h3 {color: #ff6600; font-size: 1.4em; font-weight: 500; line-height: 135%; margin: 0; padding-bottom: 15px;}
.product-range article .cat-container .category-range ul {margin: 0; list-style: none; padding: 0; -moz-column-count: 2; -webkit-column-count: 2; column-count: 2; }
.product-range article .cat-container .category-range ul li {font-size: 0.95em; position: relative; padding: 0 25px 5px 25px; line-height: 155%; margin: 0; break-inside: avoid-column;}
.product-range article .cat-container .category-range ul li::before {color: #ff6600; position: absolute; top: 0; left: 0; font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f054";}
.product-range article .cat-container .category-range ul li a {color: #ffffff;}

/* DOWNLOADS 2024 */
.navbar {z-index: 100000;}
.downloads-container {display: block; float: left; width: 100%; background: #eef1f5; position: relative; z-index: 9999;}

.loading {position: fixed; z-index: 100001; background: #ffffff; box-shadow: 0px 0px 15px 2px rgba(0,0,0,0.5); width: 600px; height: 200px; padding: 25px; border-radius: 15px; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.loading img {display: block; margin: 0 auto;}
.loading p {color: #5979c6; font-size: 1.2em; line-height: 155%; margin: 0; padding-bottom: 0px; text-align: center;}

.intro-section {float: left; width: 100%; background: #ed702d;}
.intro-section article {float: left; width: calc(100% - 634px); padding: 20px 5% 20px 0;}
.intro-section h1 {color: #ffffff; font-size: 1.9em; font-weight: 700; line-height: 115%; margin: 0; padding-bottom: 10px;}
.intro-section p {color: #ffffff; font-size: 1.0em; line-height: 155%; margin: 0; padding-bottom: 0px;}
.intro-section p a {color: #ffffff; text-decoration: underline;}
.intro-section aside {float: right; width: 634px;}
.intro-section aside .box {float: left; height: 150px; width: 150px; overflow: hidden; border-left: 3px solid #ffffff;}
.intro-section aside .box:first-child {border-left: none; margin-left: 30px;}
.intro-section aside .box img {width: 100%; height: 100%; display: block; transition: .25s all ease-in-out;}
.intro-section aside .box:hover img {transform: scale(1.1);}

.search-container {float: left; width: 100%; display: flex; flex-direction: column-reverse; flex-wrap: wrap; background: #eef1f5;}

.focus-downloads {float: left; width: 100%; height: auto; background: #eef1f5; padding: 40px 0;}
.focus-downloads h2 {color: #000000; font-size: 1.8em; font-weight: 700; line-height: 115%; margin: 0; padding-bottom: 15px;}
.focus-downloads .flex-focus {display: flex; align-content: center; gap: 10px; justify-content: space-between; flex-wrap: wrap;}
.focus-downloads .flex-focus .focus-box {width: calc(33% - 10px); overflow: hidden; margin-bottom: 10px;}
.focus-downloads .flex-focus .focus-box img {width: 100%; height: auto; transition: .25s all ease-in-out;}
.focus-downloads .flex-focus .focus-box:hover img {transform: scale(1.1);}

.search-box {float: left; width: 100%; background: #eef1f5; padding: 0 0 40px 0;}
.search-box article {float: left; width: 100%; padding: 20px; background: #5979c6;}
.search-box article h2 {color: #ffffff; font-size: 1.8em; font-weight: 700; line-height: 115%; margin: 0; padding-bottom: 15px;}
.search-box article ul.tabs {float: left; width: 100%; list-style: none; margin: 0; padding: 0;}
.search-box article ul.tabs li {float: left; display: inline; width: calc(33.33% - 3px); background: #839bd4; color: #ffffff; margin: 0; padding: 0; margin-right: 3px; transition: .25s all ease-in-out;}
.search-box article ul.tabs li.active {background: #ffffff; color: #222222;}
.search-box article ul.tabs li.active:hover {background: #ffffff;}
.search-box article ul.tabs li:last-child {margin-right: 0px; width: 33.33%;}
.search-box article ul.tabs li a {width: 100%; display: block; font-weight: 600; color: #ffffff; text-align: center; font-size: 1.1em; padding: 12px;}
.search-box article ul.tabs li.active a {width: 90%; display: block; color: #222222; border-bottom: 3px solid #ed702d; padding: 12px 12px 9px 12px; margin: 0 5%;}
.search-box article ul.tabs li:hover {background: #ed702d; color: #ffffff; text-decoration: none;}
.search-box article ul.tabs li:hover a {text-decoration: none;}
.search-box article .tabcontent {float: left; width: 100%; background: #ffffff; padding: 25px 25px 15px 25px;}
.search-box article .tabcontent form {width: 100%;}
.search-box article .tabcontent form label {font-weight: 600; color: #000000; width: 150px;}
.search-box article .tabcontent form input[type=text] {border: 1px solid #bdc1d1; height: 36px; background: #eef1f5; padding-left: 10px; border-radius: 3px; width: calc(100% - 234px);}
.search-box article .tabcontent form input[list=doctypes] {border: 1px solid #bdc1d1; height: 36px; background: #eef1f5; padding-left: 10px; border-radius: 3px; width: calc(100% - 234px);}
.search-box article .tabcontent form input[list=doctitles] {border: 1px solid #bdc1d1; height: 36px; background: #eef1f5; padding-left: 10px; border-radius: 3px; width: calc(100% - 234px);}
.search-box article .tabcontent form input[type=submit] {border: 1px solid #ed702d; height: 36px; width: 72px; background: #ed702d; color: #ffffff; font-weight: 600; border-radius: 3px;}
.search-box article .tabcontent form input[type=submit]:hover {border: 1px solid #839bd4; background: #839bd4; color: #ffffff;}
.search-box article ul#portfolio-filter a {background-color: #eef1f5;}
.search-box article ul#portfolio-filter a.current {background-color: #ff6600;}

.results-area {float: left; width: 100%; background: #ffffff; padding: 25px 0 50px 0; position: relative;}
.results-area article {float: left; width: 100%; position: absolute; top: 0px;}
.results-area article h2 {float: left; color: #000000; font-size: 1.2em; font-weight: 700; width: 70%; line-height: 115%; margin: 0; padding-bottom: 15px;}
.results-area article h2 span {color: #ed702d; font-size: 1.9em;}
.results-area article h3 {float: right; color: #000000; font-size: 1.2em; font-weight: 700; width: 30%; line-height: 115%; margin: 0; text-align: right; padding: 6px 25px 15px 0;}
.results-area a aside.list {float: left; width: 100%; margin-bottom: 5px;}
.results-area a aside.list > * {transition: .15s all ease-in-out;}
.results-area a aside.list .icon {float: left; width: 75px; height: 75px; background-color: #ed702d !important;}
.results-area a aside.list .icon.install {background: url("../images/icon-document-installation-guide.png") no-repeat center center;}
.results-area a aside.list .icon.updates {background: url("../images/icon-document-updates.png") no-repeat center center;}
.results-area a aside.list .icon.config {background: url("../images/icon-document-config.png") no-repeat center center;}
.results-area a aside.list .icon.graph {background: url("../images/icon-document-graph.png") no-repeat center center;}
.results-area a aside.list .icon.brochure {background: url("../images/icon-document-brochure.png") no-repeat center center;}
.results-area a aside.list .icon.datasheet {background: url("../images/icon-document-datasheet.png") no-repeat center center;}
.results-area a aside.list .icon.firmware {background: url("../images/icon-document-firmware.png") no-repeat center center;}
.results-area a aside.list .icon.quick-guide {background: url("../images/icon-document-quick-guide.png") no-repeat center center;}
.results-area a aside.list .icon.manual {background: url("../images/icon-document-manual.png") no-repeat center center;}
.results-area a aside.list .icon.information {background: url("../images/icon-document-manual.png") no-repeat center center;}
.results-area a aside.list .icon.white-paper {background: url("../images/icon-document-whitepaper.png") no-repeat center center;}
.results-area a aside.list .icon.case-study {background: url("../images/icon-document-case-study.png") no-repeat center center;}
.results-area a aside.list .icon.product {background: url("../images/icon-document-product.png") no-repeat center center;}
.results-area a aside.list .detail {float: left; width: calc(100% - 215px); padding: 0 25px; display: flex; align-items: center; height: 75px; background: #eef1f5;}
.results-area a aside.list .detail .document-title {color: #000000; font-size: 1.1em; font-weight: 400; line-height: 135%;}
.results-area a aside.list .date {float: left; width: 140px; height: 75px; background: #f6f8fa; color: #000000; font-size: 1.1em; font-weight: 400; line-height: 135%; margin: 0; padding: 28px 25px 0 25px;}
.results-area a:hover aside.list .icon {background-color: #839bd4 !important;}
.results-area a:hover aside.list .detail {background: #e5e8eb;}
.results-area a:hover aside.list .date {background: #f4f4f4;}

.results-area ul#portfolio-list {margin: 0; padding: 0; list-style: none; }
.results-area ul#portfolio-list li {float: left; height: auto; width: 100%; margin: 0;}
.results-area ul#portfolio-list li > a {width: 100%; height: auto; display: block; text-align: left; border: none; background-color: #f9f9f9; padding: 0; box-shadow: none;}
.results-area ul#portfolio-list li > a:hover {background-color: inherit; padding: 0; box-shadow: none;}
.results-area ul#portfolio-list li a aside.list {float: left; width: 100%; margin-bottom: 5px;}
.results-area ul#portfolio-list li a aside.list > * {transition: .15s all ease-in-out;}
.results-area ul#portfolio-list li a aside.list .icon {float: left; width: 75px; height: 75px; background-color: #ed702d !important;}
.results-area ul#portfolio-list li a aside.list .icon.install {background: url("../images/icon-document-installation-guide.png") no-repeat center center;}
.results-area ul#portfolio-list li a aside.list .icon.updates {background: url("../images/icon-document-updates.png") no-repeat center center;}
.results-area ul#portfolio-list li a aside.list .icon.config {background: url("../images/icon-document-config.png") no-repeat center center;}
.results-area ul#portfolio-list li a aside.list .icon.graph {background: url("../images/icon-document-graph.png") no-repeat center center;}
.results-area ul#portfolio-list li a aside.list .icon.brochure {background: url("../images/icon-document-brochure.png") no-repeat center center;}
.results-area ul#portfolio-list li a aside.list .icon.datasheet {background: url("../images/icon-document-datasheet.png") no-repeat center center;}
.results-area ul#portfolio-list li a aside.list .icon.firmware {background: url("../images/icon-document-firmware.png") no-repeat center center;}
.results-area ul#portfolio-list li a aside.list .icon.quick-guide {background: url("../images/icon-document-quick-guide.png") no-repeat center center;}
.results-area ul#portfolio-list li a aside.list .icon.manual {background: url("../images/icon-document-manual.png") no-repeat center center;}
.results-area ul#portfolio-list li a aside.list .icon.white-paper {background: url("../images/icon-document-whitepaper.png") no-repeat center center;}
.results-area ul#portfolio-list li a aside.list .icon.case-study {background: url("../images/icon-document-case-study.png") no-repeat center center;}
.results-area ul#portfolio-list li a aside.list .detail {float: left; width: calc(100% - 215px); padding: 0 25px; display: flex; align-items: center; height: 75px; background: #eef1f5;}
.results-area ul#portfolio-list li a aside.list .detail .document-title {color: #000000; font-size: 1.1em; font-weight: 400; line-height: 135%;}
.results-area ul#portfolio-list li a aside.list .date {float: left; width: 140px; height: 75px; background: #f6f8fa; color: #000000; font-size: 1.1em; font-weight: 400; line-height: 135%; margin: 0; padding: 28px 25px 0 25px;}
.results-area ul#portfolio-list li a:hover aside.list .icon {background-color: #839bd4 !important;}
.results-area ul#portfolio-list li a:hover aside.list .detail {background: #e5e8eb;}
.results-area ul#portfolio-list li a:hover aside.list .date {background: #f4f4f4;}

.results-area ul#portfolio-list li img {max-height: 160px; max-width: 202px; mix-blend-mode: multiply;}
.results-area ul#portfolio-list li p {width:212px; margin-top:10px; text-align:center; font-weight:bold;}


.youtube-videos {float: left; width: 100%; background: #eef1f5; padding: 50px 0; margin-bottom: 20px;}
.youtube-videos h2 {color: #000000; font-size: 1.8em; font-weight: 700; line-height: 115%; margin: 0; padding-bottom: 15px;}
.youtube-videos .flex-videos {display: flex; align-content: center; gap: 30px; justify-content: flex-start; flex-wrap: wrap;}
.youtube-videos .flex-videos aside {width: calc(33.3% - 30px); overflow: hidden;}
.youtube-videos .flex-videos aside embed {width: 100% !important; height: auto;}
.youtube-videos .flex-videos aside h3 {color: #222222; font-size: 1.1em; font-weight: 600; line-height: 135%; margin: 0; padding: 5px 0 15px 0;}

/* generic styling */
.inner {width: 1140px; margin: 0 auto;}
.inner-full {float: left; width: calc(100% - 120px); padding: 0 60px;}
.inner-50l {width: 600px; float: right;}
.inner-50r {width: 600px; float: left;}
.inner-75l {width: 900px; float: right;}
.inner-75r {width: 900px; float: left;}
.inner-66l {width: 800px; float: right;}
.inner-66r {width: 800px; float: left;}
.inner-33l {width: 400px; float: right;}
.inner-33r {width: 400px; float: left;}
.row-home {float: left; width: 100%; display: block; clear: both;}
.row-focus {float: left; width: 100%; display: block; clear: both;}
.rel {position: relative;}
.flex {display: flex;}
.col1 {float: left; width: 100%;}
.col2 {float: left; width: 50%;}
.col3 {float: left; width: 33.3%;}
.col3-span2 {float: left; width: 66.6%;}
.col4 {float: left; width: 25%;}
.col4-span3 {float: left; width: 75%;}
.col5 {float: left; width: 20%;}
.col5-span2 {float: left; width: 40%;}
.col5-span3 {float: left; width: 60%;}
.col5-span4 {float: left; width: 80%;}
.col6 {float: left; width: 16.6%;}
.col7 {float: left; width: 14.25%}
.col-switch {float: right;}
.pad10 {padding-top: 10px !important; padding-bottom: 10px !important;}
.padtop10 {padding-top: 10px !important;}
.padbot10 {padding-bottom: 10px !important;}
.pad15 {padding-top: 15px !important; padding-bottom: 15px !important;}
.padtop15 {padding-top: 15px !important;}
.padbot15 {padding-bottom: 15px !important;}
.pad25 {padding-top: 25px !important; padding-bottom: 25px !important;}
.padtop25 {padding-top: 25px !important;}
.padbot25 {padding-bottom: 25px !important;}
.pad40 {padding-top: 40px !important; padding-bottom: 40px !important;}
.padtop40 {padding-top: 40px !important;}
.padbot40 {padding-bottom: 40px !important;}
.mar25 {margin-top: 25px !important; margin-bottom: 25px !important;}
.martop25 {margin-top: 25px !important;}
.marbot25 {margin-bottom: 25px !important;}
.marlef25 {margin-left: 25px !important;}
.marrig25 {margin-right: 25px !important;}
.pad50 {padding-top: 50px !important; padding-bottom: 50px !important;}
.padtop50 {padding-top: 50px !important;}
.padbot50 {padding-bottom: 50px !important;}
.mar50 {margin-top: 50px !important; margin-bottom: 50px !important;}
.martop50 {margin-top: 50px !important;}
.marbot50 {margin-bottom: 50px !important;}
.marlef50 {margin-left: 50px !important;}
.marrig50 {margin-right: 50px !important;}
.pad75 {padding-top: 75px !important; padding-bottom: 75px !important;}
.padtop75 {padding-top: 75px !important;}
.padbot75 {padding-bottom: 75px !important;}
.mar75 {margin-top: 75px !important; margin-bottom: 75px !important;}
.martop75 {margin-top: 75px !important;}
.marbot75 {margin-bottom: 75px !important;}
.pad100 {padding-top: 100px !important; padding-bottom: 100px !important;}
.padtop100 {padding-top: 100px !important;}
.padbot100 {padding-bottom: 100px !important;}
.mar100 {margin-top: 100px !important; margin-bottom: 100px !important;}
.martop100 {margin-top: 100px !important;}
.marbot100 {margin-bottom: 100px !important;}
.pad125 {padding-top: 125px !important; padding-bottom: 125px !important;}
.padtop125 {padding-top: 125px !important;}
.padbot125 {padding-bottom: 125px !important;}
.mar125 {margin-top: 125px !important; margin-bottom: 125px !important;}
.martop125 {margin-top: 125px !important;}
.marbot125 {margin-bottom: 125px !important;}
.pad150 {padding-top: 150px !important; padding-bottom: 150px !important;}
.padtop150 {padding-top: 150px !important;}
.padbot150 {padding-bottom: 150px !important;}
.mar150 {margin-top: 150px !important; margin-bottom: 150px !important;}
.martop150 {margin-top: 150px !important;}
.marbot150 {margin-bottom: 150px !important;}
.pad250 {padding-top: 250px !important; padding-bottom: 250px !important;}
.padtop250 {padding-top: 250px !important;}
.padbot250 {padding-bottom: 250px !important;}
.mar250 {margin-top: 250px !important; margin-bottom: 250px !important;}
.martop250 {margin-top: 250px !important;}
.marbot250 {margin-bottom: 250px !important;}


/* Responsive Functionality */
@media screen and (min-width: 320px) and (max-width: 1300px) {
.slider-focus .bx-wrapper .bx-next {right: 0px;}
.slider-focus .bx-wrapper .bx-prev {right: 38px;}
}

@media screen and (min-width: 320px) and (max-width: 1244px) {
.inner {width: 90%; margin: 0 5%;}
.inner-50l {width: 90%; margin: 0 0 0 10%;}
.inner-50r {width: 95%; margin: 0 5% 0 0;}
.insights .bx-wrapper .bx-prev {left: -35px;}
.insights .bx-wrapper .bx-next {right: -35px;}
.insights .bx-wrapper .bx-prev:hover {left: -40px;}
.insights .bx-wrapper .bx-next:hover {right: -40px;}
}

@media screen and (min-width: 320px) and (max-width: 1044px) {
.intro-section article {width: calc(100% - 434px);}
.intro-section aside {width: 434px;}
.intro-section aside .box {height: 100px; width: 100px;}
}

@media screen and (min-width: 320px) and (max-width: 944px) {
.col2 {width: 100%;}
.col3 {float: left; width: 100%;}
.col3-span2 {float: left; width: 100%;}
.col4 {float: left; width: 25%;}
.col4-span3 {float: left; width: 75%;}
.col5 {float: left; width: 50%;}
.col5-span2 {float: left; width: 100%;}
.col5-span3 {float: left; width: 100%;}
.col5-span4 {float: left; width: 100%;}
.col6 {float: left; width: 50%;}
.inner-50l {width: 90%; margin: 0 5%;}
.inner-50r {width: 90%; margin: 0 5%;}
.focus-products .flex-focus .focus-box {width: calc(50% - 10px); margin-bottom: 0;}
.home-intro aside {padding-left: 0; margin-top: 25px;}
.industries p {width: 100%;}
.industries .flex-industries aside {width: 48%;}
.why-choose article {width: 100%; margin-bottom: 45px;}
.focus-intro aside {width: 100%; margin: 25px 0;}
.stats-benefits article.benefits-list ul {-moz-column-count: 2; -webkit-column-count: 2; column-count: 2;}
.product-range article .cat-container {display: block;}
.product-range article .cat-container .category-range {float: left; width: 100%; margin-bottom: 25px;}
}

@media screen and (min-width: 320px) and (max-width: 844px) {
.col2 {float: left; width: 100%;}
.col3 {float: left; width: 100%;}
.col3-span2 {float: left; width: 100%;}
.col4 {float: left; width: 100%;}
.col4-span3 {float: left; width: 100%;}
.col5 {float: left; width: 100%;}
.col5-span2 {float: left; width: 100%;}
.col5-span3 {float: left; width: 100%;}
.col5-span4 {float: left; width: 100%;}
.col6 {float: left; width: 100%;}
.cta-banners .flex-banners article {width: 100%;}
.intro-section article {width: 100%;}
.intro-section aside {width: 100%;}
.intro-section aside .box {width: 120px; height: 120px;}
.intro-section aside .box:first-child {margin-left: 0;}
.results-area ul#portfolio-list li a aside.list .icon {display: none;}
.results-area ul#portfolio-list li a aside.list .detail {width: calc(100% - 150px); padding: 8px 25px; height: auto; min-height: 75px;}
.results-area ul#portfolio-list li a aside.list .detail .date {width: 130px; padding: 8px 0; font-size: 1.0em; height: auto; min-height: 75px;}
.youtube-videos .flex-videos aside {width: calc(50% - 30px);}
}

@media screen and (min-width: 320px) and (max-width: 744px) {
.focus-products .flex-focus .focus-box {width: 100%; margin-bottom: 25px;}
.insights .bx-wrapper .bx-prev {left: -15px;}
.insights .bx-wrapper .bx-next {right: -15px;}
.insights .bx-wrapper .bx-prev:hover {left: -20px;}
.insights .bx-wrapper .bx-next:hover {right: -20px;}
}

@media screen and (min-width: 320px) and (max-width: 644px) {
.col7 {float: left; width: 100%;}
.industries .flex-industries aside {width: 100%;}
.focus-intro article h1 {font-size: 2.8em;}
.focus-intro article h2 {font-size: 2.8em;}
.slider-focus .bx-wrapper .bx-controls-direction a {bottom: 42px;}
.product-range article .cat-container .category-range ul {-moz-column-count: 1; -webkit-column-count: 1; column-count: 1;}
.youtube-videos .flex-videos aside {width: 100%;}
}

@media screen and (min-width: 320px) and (max-width: 544px) {
.stats-benefits article.key-stats .stats {width: 100%; margin-top: 25px; display: block;}
.stats-benefits article.benefits-list ul {-moz-column-count: 1; -webkit-column-count: 1; column-count: 1;}
.stats-benefits article.benefits-list ul li {width: calc(100% - 25px); padding-right: 0;}
.intro-section aside .box {height: auto; width: 22%;}
.search-box article ul.tabs li {display: block; width: 100%; margin: 0; margin-top: 1px;}
.search-box article ul.tabs li:last-child {width: 100%;}
.search-box article .tabcontent form label {width: 100%;}
.search-box article .tabcontent form input[type=text] {width: 100%; margin-bottom: 5px;}
.results-area article h3 {display: none;}
.results-area ul#portfolio-list li a aside.list .detail {width: 100%; padding: 8px 25px; height: auto; min-height: 75px;}
.results-area ul#portfolio-list li a aside.list .date {width: 100%; height: auto; padding: 8px 25px;}
}

@media screen and (min-width: 320px) and (max-width: 444px) {
.focus-intro .documentation table.tbl-documents tr td:nth-child(1) {width: 83%;}
.focus-intro .documentation table.tbl-documents tr td:nth-child(2) {width: 17%;}
.focus-intro .documentation table.tbl-documents tr th:nth-child(3), .focus-intro .documentation table.tbl-documents tr td:nth-child(3) {display: none;}
}


/* 2024 make products page the same as support */

.page-template-page-all-products{
    background-image: none;
}
.results-area.products ul#portfolio-list li {
    float: left;
    height: 270px;
    width: 205px;
    margin: 5px;
    margin-right: 18px;
}

.page-template-page-all-products .intro-section{
    min-height: 85px;
    max-height: 85px;
}

/* 

Focus products page edit 

*/

/* Support link */
.row-focus.focus-docs{
    background: #FE6600;
    padding: 10px;
    text-align: center;
}
.row-focus.focus-docs a{
   margin: 0;
   color: #fff;
}

.row-focus.focus-docs a:hover{
   margin: 0;
   color: #fff;
}
.row-focus.focus-docs .focus-intro a.btn.btn-docs-open::after {
    color: #fff;
}
.tbl-documents a{
   color: #000000!important;
}
/* Slider */
.slider-prod .bx-wrapper .bx-pager.bx-default-pager a{
    display: block!important;
}

.slider-prod{
    margin-bottom: 45px;
}

/* Slider arrows */

.slider-prod .slider,
.bx-wrapper {
  position: relative;
}
.slider-prod .bx-controls-direction {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  transform: translateY(-50%);
  pointer-events: none; /* allow clicks only on arrows */
}

.slider-prod .bx-controls-direction a {
  pointer-events: all;
  position: absolute;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.6);
  color: #fff;
  text-decoration: none;
  z-index: 10;
  margin: 0;
}
.slider-prod .bx-wrapper .bx-prev {
  left: -65px;   /* move outside slider */
}

.slider-prod .bx-wrapper .bx-next {
  right: -50px;  /* move outside slider */
}
@media screen and (max-width: 800px) {

  .slider-prod .bx-controls-direction {
    position: absolute;
    bottom: -85px;
    left: 51%;
    transform: translateX(-50%);
    width: auto;
    display: flex;
    gap: 16px;
  }

  .slider-prod .bx-controls-direction a {
    position: relative;
    left: auto;
    right: auto;
    width: 36px;
    height: 36px;
  }

}
@media screen and (max-width: 600px) {
  .slider-prod .bx-controls-direction {
    bottom: -116px;
  }
}
/* Custom dots */
.custom-pager .bx-pager {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 15px;
}

.custom-pager a {
  width: 20px;
  height: 20px;
  background: #ccc;
  display: block;
  text-indent: -9999px;
  transition: background 0.3s ease;
}

.custom-pager a.active {
  background: #FE6600; /* active square */
}