#slide{
	width:96%;
	}
	
* {
	box-sizing: border-box
}

.omySlides, .mmySlides, .nmySlides, .kmySlides {
	display: none
}

.slideshow-container {
	width: auto;
	position: relative;
	margin: -10px;

}
/* Next & previous buttons */
.oprev, .onext, .mprev, .mnext, .nprev, .nnext, .kprev, .knext {
	cursor: pointer;
	/* position: absolute; */
	top: 50%;
	width: auto;
	padding: 16px;
	margin-top: -22px;
	color: #494B55;
	font-weight: bold;
	font-size: 18px;
	transition: 0.6s ease;
	border-radius: 0 3px 3px 0;
}
/* Position the "next button" to the right */
.onext, .mnext, .nnext, .knext {
	right: 0;
	border-radius: 3px 0 0 3px;
}
/* On hover, add a black background color with a little bit see-through */
.oprev:hover, .mprev:hover, .onext:hover, .mnext:hover, .nnext:hover, .knext:hover, .nprev:hover, .kprev:hover {
	background-color: rgba(0,0,0,0.8);
}
/* Caption text */
.otext, .mtext,.ntext, .ktext {
	color: #f2f2f2;
	font-size: 16px;
	padding: 8px 12px;
	position: absolute;
	bottom: 8px;
	width: 100%;
	text-align: center;
}

/* The dots/bullets/indicators */
.odot, .mdot,.ndot, .kdot {
	cursor: pointer;
	height: 13px;
	width: 13px;
	margin: 0 2px;
	background-color: #bbb;
	border-radius: 50%;
	display: inline-block;
	transition: background-color 0.6s ease;
    margin-top: 0;
}
.odot:hover, .mdot:hover, .ndot:hover, .kdot:hover, #one-panel .active, #three-panel .active, #six-panel .active, #seven-panel .active {
	background-color: #494B55;
}
/* Fading animation */
.ofade, .mfade, .nfade, .kfade {
	-webkit-animation-name: fade;
	-webkit-animation-duration: 2s;
	animation-name: fade;
	animation-duration: 2s;
}
@-webkit-keyframes ofade {
  from {opacity: .4} 
  to {opacity: 1}
}

@keyframes ofade {
  from {opacity: .4} 
  to {opacity: 1}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .otext, .mtext, .ntext, .ktext {font-size: 11px}
}

/*.opics, .mpics
{
    border:3px solid #494B55;
    width:200px;
}	*/



.data-source--data{
    width: 100%;
    padding: 1rem 0;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-line-pack: center;
    align-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
}

.data-source.data-source--blue {
    border-bottom: 2px solid #2a07e8;
}
.data-source.data-source--green {
    border-bottom: 2px solid #ee8434;
}
.data-source.data-source--yellow {
    border-bottom: 2px solid #0fb7f8;
}

.intro-copy .data-source--data .h1 span, .intro-copy .data-source--data .supertitle {
    color: #000;
    line-height: 1.2;
}

.data-source .data-source--data .h1 {
    margin-bottom: 0.75rem;
    font-size: 36px;
    line-height: 41px;
    text-align: center;
}

.supertitle {
    color: #000;
    text-transform: uppercase;
    font: bold 0.75rem/1.25rem "Sharp Sans EN","Sharp Sans Accents","Sharp Sans Symbols","Sharp Sans",Arial,sans-serif;
    margin-bottom: 0.5rem;
}

.data-source .data-source--data {
    width: 70%;
    padding: 1rem 0;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-line-pack: center;
    align-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
}

img.no-src.lazyloaded {
    width: 100%;
}

.data-source--icon {
    width: 30%;
    padding: 0 1rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.intro-copy .data-source--data .h1 span, .intro-copy .data-source--data .supertitle {
    color: #000;
    line-height: 1.2;
}

.data-source .data-source--data .h1 {
    margin-bottom: 0.75rem;
    font-size: 36px;
    line-height: 41px;
    text-align: center;
}

@media only screen and (min-width: 975px){
.p-about .h1, .p-about h1 {
    text-align: left;
    font-size: 105px;
    margin-bottom: 0.25em;
}}
.p-about .h1, .p-about h1 {
    font-weight: 700;
    font-size: 52px;
    text-align: center;
    line-height: 1em;
    color: #000;
    margin-bottom: 0.5em;
    text-transform: uppercase;
}
@media only screen and (min-width: 975px){
.p-about p {
    font-size: 20px;
}}
.p-about p {
    color: #000;
    font: 400 16px/1.4em "Proxima Nova",Arial,sans-serif;
}

.data-source .data-source--data {
    width: 70%;
    padding: 1rem 0;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-line-pack: center;
    align-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
}

.intro-copy .data-source--data .h1 span, .intro-copy .data-source--data .supertitle {
    color: #000;
    line-height: 1.2;
}

.data-source .data-source--data .h1 {
    margin-bottom: 0.75rem;
    font-size: 36px;
    line-height: 41px;
    text-align: center;
}
@media only screen and (min-width: 975px){
    .p-about .h1, .p-about h1 {
        text-align: left;
        font-size: 105px;
        margin-bottom: 0.25em;
    }
}
.p-about .h1, .p-about h1 {
    font-weight: 700;
    font-size: 52px;
    text-align: center;
    line-height: 1em;
    color: #000;
    margin-bottom: 0.5em;
    text-transform: uppercase;
}
@media only screen and (min-width: 975px){
.p-about p {
    font-size: 20px;
}
.p-about p {
    color: #000;
    font: 400 16px/1.4em "Proxima Nova",Arial,sans-serif;
}
}
@media only screen and (min-width: 480px){
.data-source .data-source--icon {
    border-right: 1px solid #ddd;
}}

.data-source .data-source--icon {
    width: 30%;
    padding: 0 1rem;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.data-source.data-source--pink {
    border-bottom: 2px solid #000;
}

@media only screen and (min-width: 480px){
.data-source {
    width: 47%;
}}
.data-source {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
    flex-direction: row;
    background-color: #f8f9f9;
    padding: 1rem 0;
    margin-bottom: 1rem;
    -ms-flex-item-align: start;
    align-self: flex-start;
    width: 85%;
}
.data-source {
    min-height: 115px;
}
.data-source{min-height:115px}
.data-source-heading{padding-top:1rem}
@media only screen and (min-width:1120px) {
.data-source-heading{padding-top:1rem}
}
.data-source-row{-ms-flex-flow:column nowrap;flex-flow:column nowrap}
@media only screen and (min-width:480px) {
.data-source-row{-ms-flex-flow:row wrap;flex-flow:row wrap;-ms-flex-pack:distribute;justify-content:space-around}
}
@media only screen and (min-width:1120px) {
.data-source-row{-ms-flex-pack:justify;/*justify-content:space-between*/}
}
.data-source{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;background-color:#f8f9f9;padding:1rem 0;margin-bottom:1rem;-ms-flex-item-align:start;align-self:flex-start;width:85%}
.data-source:not(:nth-child(odd)){-ms-flex-item-align:end;align-self:flex-end}
@media only screen and (min-width:480px) {
.data-source:not(:nth-child(odd)){-ms-flex-item-align:start;align-self:flex-start}
}
@media only screen and (min-width:480px) {
.data-source{width:49%;    margin-bottom: 5px;}
}
@media only screen and (min-width:768px) {
.data-source{width:24%;margin-bottom:0}
}
/* @media only screen and (min-width:1120px) {
.data-source{width:49%}
} */
.data-source.data-source--yellow{border:none;background: linear-gradient(to bottom right, #2a07e8, #1a73f1) !important; box-shadow:0px 1px 3px 1px #0000002e}
.data-source.data-source--green{border:none;background: #F4F7F7;box-shadow:0px 1px 3px 1px #0000002e}
.data-source.data-source--pink{border-bottom:2px solid #000}
.data-source.data-source--blue{border-bottom:2px solid #2a07e8}
.data-source .data-source--icon{width:30%;padding:0 1rem;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}
@media only screen and (min-width:480px) {
.data-source .data-source--icon{border-right:1px solid #ddd}
}
.data-source .data-source--data{width:100%;padding:1rem 0;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-line-pack:center;align-content:center;-ms-flex-pack:center;justify-content:center;text-align:center}
.data-source .data-source--data .h1{padding:0;margin-bottom:.75rem;font-size:32px;line-height:20px;text-align:center}
.data-source .data-source--data .supertitle{color: #fff;font-size:16px;line-height:1.2;font-weight:bold;text-align: center;}

.data-source {
    min-height: 130px !important;
    margin-top: 10px;
    padding: 0;
}

.sticky-nav-links.product-right li {
    padding: 0px 12px!important;
}

@media only screen and (min-width: 768px){
.grid .col.col-small-4 {
    margin-top: 24px;
}}

@media (max-width: 767.98px){
.tabs {
    display: flex;
    width: 100%;
    overflow: auto;
    flex-flow: row;
    justify-content: normal;
}
.warpper {
    width: 100%;
}
.tab {
    min-width: 190px;
}
}


@media only screen and (max-width: 768px){
.relationframe.relationframe-arch svg {
    width: 230px;
    height: 230px;
}

}

 
#commercial:checked ~ nav [for="commercial"]::after {
    border-top: 6px solid #1a73f1;
    content: "";
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    height: 0;
    width: 0;
    position: absolute;
    bottom: -6px;
    left: 50%;
    transform: translateX(-50%);
}
#residential:checked ~ nav [for="residential"]::after{
    border-top: 6px solid #1a73f1;
    content: "";
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    height: 0;
    width: 0;
    position: absolute;
    bottom: -6px;
    left: 50%;
    transform: translateX(-50%);
}
#industrial:checked ~ nav [for="industrial"]::after{
    border-top: 6px solid #1a73f1;
    content: "";
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    height: 0;
    width: 0;
    position: absolute;
    bottom: -6px;
    left: 50%;
    transform: translateX(-50%);
}
#Security:checked ~ nav [for="Security"]::after{
    border-top: 6px solid #1a73f1;
    content: "";
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    height: 0;
    width: 0;
    position: absolute;
    bottom: -6px;
    left: 50%;
    transform: translateX(-50%);
}
  #Difference .row {
    position: relative;
    border-bottom: 1px solid #68737d;
    padding: 0.5rem 0;
}

.section__heading--inner {
  margin-bottom: 36px;
}

.section__heading--center {
  text-align: center;
}

.section__slogan {
  display: flex;
  align-items: center;
  gap: 10px;
  width: max-content;
  background: lightgray;
  border-radius: 0px;
  padding: 0 20px;
  margin-bottom: 40px;
  color: #21325e;
}

.section__slogan img {
  width: 30px;
  height: 30px;
}

.section__caption {
  margin-bottom: 30px;
  font-size: 17px;
}

.section__slogan--center {
  margin-left: auto;
  margin-right: auto;
}

.btn {
  text-decoration: none;
  display: inline-block;
  border-radius: 0px;
  min-width: 190px;
  padding: 19px 42px;
  text-align: center;
  font-size: 20px;
}

.btn--primary {
  background: #f1d00a;
  border: 2px solid #f1d00a;
  color: #21325e;
}

.btn--primary:hover,
.btn--primary:focus {
  background: #fff;
  border: 2px solid #21325e;
  color: #21325e;
}

/* TABS */



#Difference .info__box {
      position: relative;
    left: 0;
    top: 40px;
    right: 0;
    width: auto;
    bottom: 0;
    overflow: auto;
    padding: 20px 80px;
    background: #F4F7F7;
    display: none;
    border-radius: 0;
}

.info__box--text {
  flex-basis: 50%;
  flex-grow: 1;
}

.info__box--text .icon {
  color: #f1d00a;
}

#Difference nav {     
  height: 70px;
  margin: auto;
  display: flex;
 /* display: table;
  width: 90%;
*/}
@media only screen and (max-width: 575px){
#Difference nav {     
        display: inline;
    height: 70px;
    margin: auto;
}}

@media (min-width: 0px) and (max-width: 575px){
    #Difference label{
    margin-right: 0;
    border-right: 1px solid lightgrey !important;
}}
#Difference  input {
  display: none;
}




#Difference  label {
    width: 400px;
    float: left;
    z-index: 2;
    padding: 16px 0;
    cursor: pointer;
    margin: 0;
    background: #F4F7F7;
    display: inline-flex;
    color: #000;
    text-align: center;
    height: 60px;
    align-items: center;
    justify-content: center;
    border: 1px solid;
    border-right: none !important;
    border-color: #d3d3d3;
     font: 700 16px "open sans";
}

p.feature-text.field-value {
    display: contents;
    flex-direction: row;
    font-size: 16px;
   font-weight: normal;
    align-self: center;
    color: #000;
}

p.feature-text
{
  font-weight: 600;
  font-size: 1rem;
  text-align: left;
}
p.feature-text {
    margin-inline-end: auto;
}
#Difference  label:last-child {
     margin-right: 0;
    border-right: 1px solid lightgrey !important;
}

#Difference  label:hover {
  background: #1a73f1;
  border: 1px solid #1a73f1;
  color: #fff;
}
#Difference label:before {
  display: block;
  font-size: 3rem;
  line-height: 5rem;
  z-index: 2;
}
@media (min-width: 0px) and (max-width: 575px){
.p-home .section-customer-experience .container .row .col-small-4 {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: 46.333333%;
    text-align: center;
    padding: 8px 0;
}}
@media (min-width: 0px) and (max-width: 575px){
.p-home .section-customer-experience .container .row .col-small-4 {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: 46.333333%;
    text-align: center;
    padding: 8px 0;
}}
@media only screen and (max-width: 575px){
.pricing-plan .row .col-4:first-child {
    width: 100%!important;
    text-align: center!important;
    align-items: center;
    justify-content: center;
    display: block;
}}
#commercial:checked ~ nav [for="commercial"],
#residential:checked ~ nav [for="residential"],
#industrial:checked ~ nav [for="industrial"],
#Security:checked ~ nav [for="Security"] {
    background: #1a73f1;
    border: 1px solid #1a73f1;
 color: #fff;
 position: relative;
}


#commercial:checked ~ .uno,
#residential:checked ~ .dos,
#industrial:checked ~ .tres,
#Security:checked ~ .Sec {
  display: flex;
  gap: 75px;
  align-items: center;
}
.supertitle {
    color: #000;
    text-transform: capitalize;
    /*place-self: center;*/
    margin-bottom: 0.5rem;
        word-break: break-word;
        font: normal 16px/1 Open Sans;
        font-weight: 600;
        font-size: 1rem;
        line-height: normal;
}
/*@media only screen and (min-width: 768px){
.grid .col.col-small-4 {
      margin-top: 8px;
    padding: 8px;
    margin-bottom: 6px;
    display: flex;
    align-items: flex-start;
        /*word-break: break-word;
}}*/

.col-4:first-child {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: 33.3333333333%;
}
@media (min-width: 0px) and (max-width: 575px){
.grid .col.col-4 {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: 100% !important;
}}
/*@media (min-width: 0px) and (max-width: 575px){
.container .row .col-small-4 {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: 46.333333%;
    text-align: center;
    padding: 8px 0;
}}*/
@media (min-width: 0px) and (max-width: 575px){
    #Difference label {
    cursor: pointer;
    margin: 0;
    background: #fff;
    display: inline-flex;
    color: #000;
    width: 25%;
    text-align: center;
    height: 60px;
    align-items: center;
    justify-content: center;
    border: 1px solid;
    border-right: none;
    border-color: #d3d3d3;
    font: 700 16px "open sans";
}}

@media (min-width: 0px) and (max-width: 575px){
.grid .col.col-4 {
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: 50% !important;
}}

@media only screen and (min-width: 768px){
.grid .col.col-small-4 {
     margin-top: 0px; 
    text-align: -webkit-center !important;
    padding: 8px;
    align-items: center;
}
}

@media only screen and (max-width: 913px){
#Difference label {
    cursor: pointer;
    padding: 0px 10px;
    margin: 0;
    background: #fff;
    display: inline-flex;
    color: #000;
    width: 25%;
    text-align: center;
    height: 60px;
    align-items: center;
    justify-content: center;
    border: 1px solid;
    border-right: 1px solid lightgrey !important;
    border-color: #d3d3d3;
    font: 700 16px "Sharp Sans EN","Sharp Sans Accents","Sharp Sans Symbols","Sharp Sans",Arial,sans-serif;
}}

@media (min-width: 0px) and (max-width: 575px){
#Difference label {
    min-width: 280px;
    border-right: 1px solid lightgrey !important;
}}
@media only screen and (max-width: 575px){
#Difference label {
    min-width: 250px;
    display: flex;
    flex-flow: column;
    width: 100%;
    align-items: center;
}
p.feature-text
{
    text-align: center;
    }}
@media (min-width: 0px) and (max-width: 575px){
#Difference .info__box {
    position: relative;
    left: 0;
    top: 40px;
    right: 0;
    width: 100%;
    bottom: 0;
    overflow: auto;
    padding: 10px 40px;
    background: #f8f9f9;
    display: none;
}    }


.prev, .next {
    cursor: pointer;
    position: absolute;
    top: 0;
    display: flex;
    bottom: 0;
    margin: auto;
    width: auto;
    padding: 16px;
    margin-top: -22px;
    color: #000;
    font-weight: bold;
    font-size: 48px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    text-decoration: none;
    align-items: center;
    font-weight: 100;
}
.ss-container p {
    min-height: 45px;
}
.prev:hover, .next:hover
{
    text-decoration: none;
}

    .next {
    right: -30px;
    border-radius: 3px 0 0 3px;
}
.prev{
    left: -30px;
}






@media only screen and (min-width:992px) and (max-width: 1121px){
.data-source {
    width: 24% !important;
    margin-bottom: 0;
}
.login-in {
    /* color: #fff!important; */
    font-size: 18PX!important;
    padding: 12PX 11PX!important;   
    width: 7rem;
    margin-left: 12px !important;
}
.global-header .primary-nav .primary-link {
        font-size: 13px;
        padding: 14px 10px;
        text-align: center;
}
section.hero.active {
    padding-top: 6rem !important;
    padding-bottom: 2rem !important;
}
}    


@media only screen and (min-width: 481px) and (max-width: 1121px){

    }


@media (min-width: 481px) and (max-width: 516px){
img.tech-img.image-mobile {
    height: 62%;
    min-width: 54%;
    object-fit: contain;
    margin-top: 3rem;
    position: absolute;
    top: 0;
}   

section.hero.active .col.col-small-6.col-image {
    height: auto;
    padding-bottom: 0;
} 
.p-capability section.hero h1 {
    font-size: 35px;
    color: #fff;
}
}


@media (min-width: 517px) and (max-width: 600px){

img.tech-img.image-mobile {
    height: 61%;
    min-width: 54%;
    object-fit: contain;
    position: absolute;
    top: 71px;
}
.hero .col.col-image {
    padding-bottom: 0px;
}
.p-capability section.hero h1 {
    font-size: 35px;
    color: #fff;
}
}

@media (min-width: 601px) and (max-width: 768px){
img.tech-img.image-mobile {
    height: 100%;
    min-width: 54%;
    object-fit: contain;
    position: absolute;
    top: 0px;
}
.hero .col.col-image {
    padding-bottom: 0px;
}
.p-capability section.hero h1 {
    font-size: 32px;
}
}
@media (min-width: 767.5px) and (max-width: 991px){
    .p-capability section.hero h1 {
        font-size:42px;
    }
}

@media only screen and (max-width: 1281px){
    .relationframe.relationframe-arch {
    display: none;
}
/*section.hero.active {
    padding-top: 10rem !important;
    padding-bottom: 6rem !important;
}*/

        img.tech-img.image-desk {
    display: none;
}
img.tech-img.image-mobile-shadowless {
    display: block !important;
        padding: 0rem 2rem;
    margin-top: 0rem;
}
}
@media only screen and (min-width: 1120px){
    section.hero.active {
    padding-top: 10rem !important;
    padding-bottom: 6rem !important;
}

        img.tech-img.image-desk {
    display: block;
}
img.tech-img.image-mobile-shadowless {
    display: none;
}
}

@media only screen and (min-width: 1281px){

section.hero.active {
        padding-top: 6rem !important;
    padding-bottom: 3rem !important;
}
    }
input#LEGAL_CONSENT\.subscription_type_27449206-2ffad593-559d-4c35-b1f5-6ec6e2badf3c {
    width: 12px !important;
    margin-left: 0px;
    margin-top: 6px;
}