* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Montserrat', sans-serif;
    
}
body .submenuhang_color{font-size: 16px;}
.container {
    max-width: 1170px;
    width: 100%;
    margin: auto;

}

/* .scene-banner {
    background-image: url(../images/banner-bg.png) !important;
} */
.sec-img img{    height: 100%;
    object-fit: cover;}
.banner-part {
   
    background-size: cover;
    background-position: center right;
    height: 690px;
    padding-top: 80px;
    display: flex;
    align-items: flex-end;
}

.banner-part {
    background-image: url(../images/banner/mgis-banner.png);
    background-size: cover;
    background-position: center right;
    height: 690px;
    padding-top: 80px;
    display: flex;
    align-items: flex-end;
}

.banner-part .bann-btns {
    display: flex;
    gap: 35px;
    flex-wrap: wrap;
}

.banner-part .heading {
    font-size: 40px;
    font-weight: 700;
    color: #fff;
    margin-bottom: 40px;
    line-height: 54px;
}

.homepage .banner-part .heading {

    margin-bottom:20px;

}

.banner-part .para {
    color: #fff;
    margin-bottom: 40px;
    line-height: 1.6;
    font-size: 18px;
}
.start .start-btns{    justify-content: center;}
.secondary-btn {
    font-size: 16px;
    text-decoration: none;
    background: #21D0B2;
    border: 1px solid #21D0B2;
    padding: 15px 40px;
    color: #000000;
    border-radius: 40px;
    font-weight: bold;
}

.primary-btn {
    text-decoration: none;
    padding: 15px 40px;
    color: #21D0B2;
    font-size: 16px;
    border: 1px solid #21D0B2;
    border-radius: 40px;
    font-weight: bold;
}

.allcont-banner {
    display: grid;
    grid-template-columns: 65% 1fr;
}

/*partners*/
.partners {
    padding: 100px 0px;
}

.partners .para {
    font-size: 30px;
    font-weight: 600;
    text-align: center;
    line-height: 50px;
}

.partners .partners-logo {
    display: flex;
    gap: 34px;
    justify-content: center;
    margin-top: 55px;
    margin-top: 55px;
    align-items: center;
    flex-wrap: wrap;
}

/*partners*/

/*advantages*/
.advantage {
    background: #F4F9FE;
    padding: 60px 0px;
}

.advantage .head {
    text-align: center;
    font-size: 40px;
    font-weight: bold;
    line-height: 50px;
    margin-bottom: 60px;
}

.tab {
    overflow: hidden;
    border-bottom: 1px solid #ccc;
    margin-bottom: 36px;
    gap: 42px;
    display: flex;
}

.tab button {
    background-color: inherit;
    float: left;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 14px 16px;
    color: #666666;
    /* transition: .2s; */
    font-size: 16px;
    font-weight: 500;
}

.tab button.active {
    border-bottom: 3px solid #21D0B2;
    color: #21D0B2;
}

.tabcontent {
    padding: 39px 30px;
    border-top: none;
    background: #DAEBFB;
    border-radius: 10px;
}

.tabs-d {
    display: flex;
}

.tabs-head {
    font-size: 30px;
    font-weight: bold;
    line-height: 42px;
    margin-bottom: 25px
}

.tabs-para {
    color: #4B4A4A;
    font-size: 16px;
    line-height: 32px;
    font-weight: 400;
}

.tabs-img {
    flex: 0 0 45%;
    max-width: 45%;
}

.tabs-cont-ones {
   display: flex;
   align-items: center;
    padding: 0px 100px 0px 60px;
}

.tabs-cont-two {
    padding: 0px 60px 0px 20px;
}

.tabs-cont-ones {
    padding: 0px 20px 0px 60px;
}

/*advantages*/

/*highlights*/
.highlights {
    display: none;
}

.highlights {
    padding: 45px 0px 65px 0px;
    background: #F4F9FE;
}

.highlights .head {
    text-align: center;
    font-size: 30px;
    font-weight: bold;
    margin-bottom: 39px;
}

/*highlights*/
/*accordion*/
.accord-input {
    position: absolute;
    opacity: 1;
    z-index: -1;
}

.accordion-wrapper {
    border-radius: 8px;
    overflow: hidden;
    /* width: 600px; */
    margin: 0 auto;
}

.accordion {
    width: 100%;
    color: white;
    overflow: hidden;
    border-top: 1px solid #DBDBDB;
}

.accordion:last-child {
    margin-bottom: 0;
}

.accordion-label {
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
    font-weight: bold;
    cursor: pointer;
    font-size: 16px;
    color: #666666;
    transition: .5s;
    padding: 25px 0px 25px 0px;
}

.accordion-label:hover {
    color: #21D0B2;
}

.accordion-label:hover {
    /* background: rgba(4,57,94,1); */
}

.accordion-label::after {
    -webkit-transform: rotate(-88deg);
    content: "\276F";
    width: 16px;
    height: 16px;
    text-align: center;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    display: flex;
    align-items: center;
}

.accordion-content {
    max-height: 0;
    color: rgba(4, 57, 94, 1);
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

.accordion-content p {
    margin: 0;
    color: #4B4A4A;
    line-height: 26px;
    font-size: 14px;
    margin-bottom: 15px;
}

input:checked+.accordion-label {
    /* background: rgba(4,57,94,1); */
}

input:checked+.accordion-label::after {
    /* -webkit-transform: rotate(-88deg); */
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}

input:checked~.accordion-content {
    max-height: 100vh;
    margin: 35px 0px 25px 0px;
    transition: all .5s;
}
.arrowmobile {
    display: none;
}

.headd {
    font-size: 20px;
    margin-bottom: 15px;
    line-height: 42px;
    color: #000;
    font-weight: bold;
}

.accord-lst {
    border-bottom: 1px solid #DBDBDB;
}

/*accordion*/

/*empowers*/
.empowers {
    padding: 100px 0px;
}

.empowers .head {
    text-align: center;
    font-size: 40px;
    line-height: 42px;
    margin-bottom: 61px;
    font-weight: 700;
}

.cards-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 22px;
}

.cards {
    border: 1px solid #CECECE;
    padding: 40px 25px 45px 23px;
    border-radius: 6px;
    box-shadow: #00000014 0px 0px 22px 2px;
}

.crd-icn {
    margin-bottom: 26px;
}

.head-b {
    font-size: 18px;
    line-height: 30px;
    color: #141414;
    margin-bottom: 10px;
}

.para-b {
    font-size: 14px;
    color: #666666;
    line-height: 20px;
}

/*empowers*/

/*focuses*/
.focuses ,.vdo-focuses{
    background-image: url(../images/map.png);
    background-repeat: no-repeat;
    padding: 80px 0px 83px 0px;
    background-position: right top;
    background-size: cover;
}

.focuses .head {
    font-size: 40px;
    line-height: 42px;
    text-align: center;
    color: #fff;
    font-weight: bold;
    margin-bottom: 60px;
}

.fcs-hdtwo {
    display: none;
}

.focus-division {
    display: flex;
}

.focus-division-two {
    display: flex;
}

.fhead {
    color: #141414;
    font-size: 30px;
    margin-bottom: 25px;
    line-height: 40px;
    font-weight: 800;
}

.focus-one-cont {
    width: 53%;
    display: flex;
    align-items: center;
    background: #fff;
    padding: 40px 50px 40px 52px;

}

.focus-one-img {
    width: 47%;
}

.fpara, .focus-one-conts ul li p {
    color: #4B4A4A;
    line-height: 30px;
   
    font-size: 18px;
}
.vdo-focuses .li-wrap{padding: 0; margin: 0; }
.vdo-focuses .li-wrap h2{padding:25px 0 0;  }
.focuses .fcsbtn {
    text-decoration: none;
    color: #21D0B2;
    font-weight: 600;
    font-size: 16px;
    border: 1px solid #21D0B2;
    padding: 17px 37px 16px 37px;
    border-radius: 40px;
}

.focus-one-img img {
    width: 100%;
    display: block;
   

}

.focus-division {
    margin-bottom: 65px;
    margin-top: 65px;
    box-shadow: rgba(0,0,0,0.1) 0px  0px 10px ;
}

 
.focus-border-two,
.focus-border-four {
    border-radius: 0px 15px 15px 0px;
}

/*focuses*/
.read_more_b{display: flex; padding-top: 30px;}
/*start*/
.start {
    background: #E7EEF5;
    padding: 60px 0px 67px 0px;
    justify-content: center;
    display: flex;
    text-align: center;
}

.start .head {
    font-size: 29px;
    line-height: 35px;
    margin-bottom: 8px;
    font-weight: 600;
}

.start .para {
    font-size: 18px;
    line-height: 21px;
    margin-bottom: 25.6px;
    font-weight: 500;
}

.start-btns {
    gap: 29px;
    display: flex;
}

.start .startbtn {
    background: #F18F4A;
    text-decoration: none;
    font-size: 16px;
    color: #fff;
    padding: 13px 34px;
    border-radius: 22px;
    font-weight: 500;
}

.start .cntctbtn {
    background: #fff;
    border: 1px solid #000000;
    color: #000000;
    padding: 13px 43px;
    background: none;
    text-decoration: none;
    border-radius: 22px;
    font-size: 16px;
    font-weight: 600;
}

/********Sub menu*****/

.ML_sub_menu .right_menu {
    margin-right: auto;
}

.ML_sub_menu {
    position: absolute;
    top: 60px;
    color: #fff;
    left: 0;
    z-index: 22;
    width: 100%;
    background: rgba(0, 0, 0, 20%);
    box-shadow: rgb(0 0 0 / 1%) 0 10px 10px;
    border-top: rgba(0, 0, 0, 0.12) 1px solid;
}

.black_white_color .ML_sub_menu {
    background: rgba(255, 255, 255, .74);
    box-shadow: rgb(0 0 0 / 1%) 0 10px 10px;
    border-top: rgba(0, 0, 0, .12) 1px solid;
}

.ML_sub_menu .right_menu ul {
    margin: 0;
    padding: 0;
    display: flex;
}

.ML_sub_menu .right_menu ul li {
position: relative;
    list-style: none;
}

.ML_sub_menu .right_menu ul li a {
    font-size: 13px;
    font-weight: 500;
    border-bottom: rgba(0, 0, 0, 0) 2px solid;
    padding: 15px 25px;
    display: block;
    color: #fff;
}

.black_white_color .ML_sub_menu .right_menu ul li a {
    color: #000; 
}

.ML_sub_menu .right_menu ul li.active a,
.ML_sub_menu .right_menu ul li a:hover {
    color: #f18f4a;
}
.ML_sub_menu .right_menu ul .suMenu_list{position: absolute; transition: all 0.4s; padding: 10px 0; margin-top: -10px; border-radius: 0 0  10px 10px; left:0 ;pointer-events: none; opacity: 0; transform: translateY(-20); display: block; background: #fff; width: 200px;}
.ML_sub_menu .right_menu ul li:hover .suMenu_list{opacity: 1; pointer-events: all; transform: translateY()(-0); margin-top: 0px; }
.suMenu_list li{display: flex;}
.ML_sub_menu .right_menu ul .suMenu_list li a{ color: #000; padding: 6px 20px; }
.ML_sub_menu .right_menu ul .suMenu_list li a:hover{ color: #F18F4A; padding: 6px 20px; }
 
.ML_sub_menu .right_menu ul li a{display: flex;}
.ML_sub_menu .right_menu ul .suMenu_list img{display: inline-block;   ;}
.left_title {
    font-size: 24px;
    color: #fff;
    font-weight: 600;
    padding: 16px 0;
    flex: 0 0 19%;
}
.left_title a{color: #fff;    }
/*******************/
/*form*/
.frm {
    padding: 80px 0px;
}

.frm .para {
    color: #707070;
    font-size: 14px;
}

.fname {
    position: unset;
    outline: none;
    border-bottom: 1px solid #BFBFBF !important;
    border: none;
    font-size: 16px;
    padding-bottom: 30px;
    width: 100%;
    color: #7C7C7C;
    font-weight: 500;
}

.mainfrm {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 37px;

}
.frmbrdr{    width: 600px; max-width: 100%;}
.frmbrdr {
    display: flex;
    flex-direction: column;
    gap: 37px;
    border: 1px solid #21D0B2;
    padding: 73px 63px 47px 71px;
    border-radius: 10px;
}

.frmbtnn a {
    text-decoration: none;
    color: #000;
    background: #21D0B2;
    padding: 16px 55px;
    border-radius: 40px;
    font-weight: bold;
    font-size: 16px;
}

.switch {
    position: relative;
    display: inline-block;
    width: 45px;
    height: 20px;
}

.frm .para span {
    text-decoration: underline;
    font-weight: 600;
    color: #000;
}

.switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #EBEBEB;
    -webkit-transition: .4s;
    transition: .4s;
}

.slider:before {
    position: absolute;
    content: "";
    height: 20px;
    width: 20px;
    top: 0px;
    bottom: 4px;
    background-color: #fff;
    box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
    -webkit-transition: .4s;
    transition: .4s;
}

input:checked+.slider {
    background-color: #21D0B2;
}

input:focus+.slider {
    box-shadow: 0 0 1px #21D0B2;
}

input:checked+.slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(26px);
}

.switchs {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 45px;
}

/* Rounded sliders */
.slider.round {
    border-radius: 34px;
}

.slider.round:before {
    border-radius: 50%;
}

/*form*/
 
 

.focuses-parts .fcs-wraps {
    box-shadow: rgb(0 0 0 / 8%) -1px 0px 10px;
}

.focus-division-two .fcs-wraps {
    box-shadow: rgb(0 0 0 / 8%) 7px 0px 10px;
}

/*mgis scene*/

/*videos*/
.slideshow-container {
    /* max-width: 1000px; */
    position: relative;
}

.prev,
.next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -22px;
    color: white;
    font-weight: bold;
    font-size: 18px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
}


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

.prev:hover,
.next:hover {
    background-color: rgba(0, 0, 0, 0.8);
}

.text {
    color: #f2f2f2;
    font-size: 15px;
    padding: 8px 12px;
    position: absolute;
    bottom: 8px;
    width: 100%;
    text-align: center;
}

/* .numbertext {
    color: #f2f2f2;
    font-size: 12px;
    padding: 8px 12px;
    position: absolute;
    top: 0;
  } */
.dot {
    display: none !important;
}


.dot:hover {
    background-color: #717171;
}

.fade {
    animation-name: fade;
    animation-duration: 1.5s;
}

.vdos {
    height: 100%;
    width: 553px;
}

.mySlides {
    height: 100%;
}
.d-none-g{display: none;}

@keyframes fade {
    from {
        opacity: .4
    }

    to {
        opacity: 1
    }
}

/*videos*/

/* map data and visualization */
.visualization-banner {
    background-image: url(../images/banner/map-data-banner.png);
}

.fcs-scroll {
    height: 475px;
    overflow-y: scroll;
}

.focuses-parts ul li {
    list-style: none;
}

.li-wrap {
    margin-bottom: 30px;
}

.focuses-parts .lishead {
    font-size: 20px;
    font-weight: bold;
    color: #141414;
}

.focuses-parts .lispara {
    color: #4B4A4A;
    line-height: 24px;
    margin-top: 15px;
}

/* map data and visualization */

/* creation and management */
.creation-management-banner {
    background-image: url(../images/banner/creation-management.png);
}

/* creation and management */
/* spatial analytics mgis vision */
.spatial-analytics-banner {
    background-image: url(../images/banner/sptal-analytics.png);
}

/* spatial analytics mgis vision */
/*  enterprise enabled */
.enterprise-enabled {
    background-image: url(../images/banner/enterprise-enabled.png);
}

/* enterprise enabled */

.myfpara {
    margin-bottom: unset;
}

.focus-divisions {
    display: grid;
    grid-template-columns: 52% 1fr;
   
}
.vdo-focuses .focus-division-two,.vdo-focuses .focus-division-two{ border-radius: 15px; overflow: hidden;}
.focus-one-conts {
    display: flex;
 
    align-items: center;
   
    padding: 0px 52px;
    border-radius: 10px 0px 0px 10px;
}
 
/*videos*/

/* map data and visualization */
.visualization-banner{
    background-image: url(../images/banner/map-data-banner.png);
}
/*scrollbar*/
.fcs-scroll{
    height: 486px;
    overflow-y: scroll;
    border-radius: 13px;
    align-items: baseline;
}
.fcs-scroll::-webkit-scrollbar {
    width: 10px;
}

.fcs-scroll::-webkit-scrollbar-track {
    background: #ABFFF2;
}

.fcs-scroll::-webkit-scrollbar-thumb {
    background-color: #21D0B2;
    border-radius: 10px;

}
/*scrollbar*/

.vdo-focuses ul li{
    list-style: none;
}
.vdo-focuses .li-wrap{
 
}
.vdo-focuses .lishead{
    font-size: 20px;
    font-weight: bold;
    color: #141414;
}
.vdo-focuses .lispara{
 font-size: 16px;
  
   
}
.scroll-cont{
    justify-content: unset !important;
}
/* map data and visualization */

/* creation and management */
.creation-management-banner{
    background-image: url(../images/banner/creation-management.png);
}
/* creation and management */
/* spatial analytics mgis vision */
.spatial-analytics-banner{
    background-image: url(../images/banner/sptal-analytics.png);
}
/* spatial analytics mgis vision */
/*  enterprise enabled */
.enterprise-enabled{
    background-image: url(../images/banner/enterprise-enabled.png);
}
/* enterprise enabled */

.vdo-focuses .myfpara{
    margin-bottom: unset;
}
.vdo-focuses .focus-divisions{
    display: grid;
    grid-template-columns: 52% 1fr;
    margin-bottom: 65px;
}
.vdo-focuses .focus-one-conts{
    display: flex;
    
    
    padding: 40px 40px;
    border-radius: 15px 0px 0px 15px;
    background: #fff;
    box-shadow: rgb(0 0 0 / 8%) -1px 0px 10px;
 
}
.vdo-focuses .video-rght{
    border-radius: 0px 15px 15px 0px;
}
.vdo-focuses{
   
    padding: 80px 0px 83px 0px;
}
.vdo-focuses .main{
    display: none;
}
.vdo-focuses .focus-division-two{
    display: grid;
    grid-template-columns: 47% 1fr;
    margin-bottom: 65px;
  
}
.vdo-focuses .focus-border-four{
    border-radius: 0px 15px 15px 0px;
}
.vdo-focuses .vdo-lft{
    border-radius: 15px 0px 0px 15px;
}
.fcsmrgn{
    margin-bottom: unset !important;
}
.focus-one-img  {display: block; border-radius: 0px 15px 15px 0; background-color: #000;}
.focus-division-two .focus-one-img  {display: block; border-radius:15px 0 0 15px; background-color: #000;}
.focus-one-img img{display: block;}
/*videos*/
.slide-videos{
    background: #000;
    border-radius: 0px 15px 15px 0px;
}
.slide-vdotwo{
    border-radius: 15px 0px 0px 15px;
}
.csslider {
    -moz-perspective: 1300px;
    -ms-perspective: 1300px;
    -webkit-perspective: 1300px;
    margin-bottom: 22px;
}
.csslider > input {
    display: none;
}
.csslider > input:nth-of-type(10):checked ~ ul li:first-of-type {
    margin-left: -900%;
}
.csslider > input:nth-of-type(9):checked ~ ul li:first-of-type {
    margin-left: -800%;
}
.csslider > input:nth-of-type(8):checked ~ ul li:first-of-type {
    margin-left: -700%;
}
.csslider > input:nth-of-type(7):checked ~ ul li:first-of-type {
    margin-left: -600%;
}
.csslider > input:nth-of-type(6):checked ~ ul li:first-of-type {
    margin-left: -500%;
}
.csslider > input:nth-of-type(5):checked ~ ul li:first-of-type {
    margin-left: -400%;
}
.csslider > input:nth-of-type(4):checked ~ ul li:first-of-type {
    margin-left: -300%;
}
.csslider > input:nth-of-type(3):checked ~ ul li:first-of-type {
    margin-left: -200%;
}
.csslider > input:nth-of-type(2):checked ~ ul li:first-of-type {
    margin-left: -100%;
}
.csslider > input:nth-of-type(1):checked ~ ul li:first-of-type {
    margin-left: 0%;
}
.csslider > ul {
    position: relative;
    z-index: 1;
    font-size: 0;
    line-height: 0;
    margin: 0 auto;
    padding: 0;
    overflow: hidden;
    white-space: nowrap;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.csslider > ul > li {
    position: relative;
    display: inline-block;
    width: 100%;
    height: 100%;
    overflow: hidden;
    -moz-transition: all 0.5s cubic-bezier(0.4, 1.3, 0.65, 1);
    -o-transition: all 0.5s ease-out;
    -webkit-transition: all 0.5s cubic-bezier(0.4, 1.3, 0.65, 1);
    transition: all 0.5s cubic-bezier(0.4, 1.3, 0.65, 1);
    vertical-align: top;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    white-space: normal;
}
.csslider > .navigation {
    position: absolute;
    bottom: 4px;
    left: 50%;
    z-index: 10;
    margin-bottom: -10px;
    font-size: 0;
    line-height: 0;
    text-align: center;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.csslider > .navigation > div {
      margin-left: -100%;
}
.csslider > .navigation label {
    position: relative;
    display: inline-block;
    cursor: pointer;
    border-radius: 50%;
    margin: 0 4px;
    padding: 4px;
    border: 1px solid #21d0b2;
}
.csslider > .navigation label:after {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -6px;
    margin-top: -6px;
    background: #21D0B2;
    border-radius: 50%;
    padding: 6px;
    opacity: 0;
}

.csslider.inside .navigation {
    bottom: 10px;
    margin-bottom: 10px;
}
.csslider > input:nth-of-type(1):checked ~ .navigation label:nth-of-type(1):after,
.csslider > input:nth-of-type(2):checked ~ .navigation label:nth-of-type(2):after,
.csslider > input:nth-of-type(3):checked ~ .navigation label:nth-of-type(3):after,
.csslider > input:nth-of-type(4):checked ~ .navigation label:nth-of-type(4):after,
.csslider > input:nth-of-type(5):checked ~ .navigation label:nth-of-type(5):after,
.csslider > input:nth-of-type(6):checked ~ .navigation label:nth-of-type(6):after,
.csslider > input:nth-of-type(7):checked ~ .navigation label:nth-of-type(7):after,
.csslider > input:nth-of-type(8):checked ~ .navigation label:nth-of-type(8):after,
.csslider > input:nth-of-type(9):checked ~ .navigation label:nth-of-type(9):after,
.csslider > input:nth-of-type(10):checked ~ .navigation label:nth-of-type(10):after,
.csslider > input:nth-of-type(11):checked ~ .navigation label:nth-of-type(11):after {
    opacity: 1;
}

.csslider > .arrows {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.csslider > .arrows {
    position: absolute;
    left: 11px;
    top: 50%;
    width: 83%;
    height: 26px;
    padding: 0 31px;
    z-index: 0;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    z-index: 99999;
}
.csslider > .arrows label {
    display: none;
   
    top: -50%;
    padding: 8px; position: absolute;
    box-shadow: inset 2px -2px 0 1px #fff;
    cursor: pointer;
    -moz-transition: box-shadow 0.15s, margin 0.15s;
    -o-transition: box-shadow 0.15s, margin 0.15s;
    -webkit-transition: box-shadow 0.15s, margin 0.15s;
    transition: box-shadow 0.15s, margin 0.15s;
}
.csslider > .arrows label:hover {
    box-shadow: inset 3px -3px 0 2px #21D0B2;
    margin: 0 0px;
}
.csslider   .arrows label:before {
    content: '';
    position: absolute;
    top: -100%;
    left: -100%;
    height: 300%;
    width: 300%;
}
.csslider > .arrows label:before {
    content: '';
    position: absolute;
    top: -100%;
    right:  -100%;
    height: 300%;
    width: 300%;
}
.csslider.infinity  input:first-of-type:checked ~ .arrows label.goto-last,
.csslider > input:nth-of-type(1):checked ~ .arrows > label:nth-of-type(0),
.csslider > input:nth-of-type(2):checked ~ .arrows > label:nth-of-type(1),
.csslider > input:nth-of-type(3):checked ~ .arrows > label:nth-of-type(2),
.csslider > input:nth-of-type(4):checked ~ .arrows > label:nth-of-type(3),
.csslider > input:nth-of-type(5):checked ~ .arrows > label:nth-of-type(4),
.csslider > input:nth-of-type(6):checked ~ .arrows > label:nth-of-type(5),
.csslider > input:nth-of-type(7):checked ~ .arrows > label:nth-of-type(6),
.csslider > input:nth-of-type(8):checked ~ .arrows > label:nth-of-type(7),
.csslider > input:nth-of-type(9):checked ~ .arrows > label:nth-of-type(8),
.csslider > input:nth-of-type(10):checked ~ .arrows > label:nth-of-type(9),
.csslider > input:nth-of-type(11):checked ~ .arrows > label:nth-of-type(10)  
.csslider > input:nth-of-type(12):checked ~ .arrows > label:nth-of-type(11)  


 {
    display: block;
    left: 0;
    right: auto;
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
}
.csslider.infinity > input:last-of-type:checked ~ .arrows label.goto-first,
.csslider > input:nth-of-type(1):checked ~ .arrows > label:nth-of-type(2),
.csslider > input:nth-of-type(2):checked ~ .arrows > label:nth-of-type(3),
.csslider > input:nth-of-type(3):checked ~ .arrows > label:nth-of-type(4),
.csslider > input:nth-of-type(4):checked ~ .arrows > label:nth-of-type(5),
.csslider > input:nth-of-type(5):checked ~ .arrows > label:nth-of-type(6),
.csslider > input:nth-of-type(6):checked ~ .arrows > label:nth-of-type(7),
.csslider > input:nth-of-type(7):checked ~ .arrows > label:nth-of-type(8),
.csslider > input:nth-of-type(8):checked ~ .arrows > label:nth-of-type(9)
.csslider > input:nth-of-type(9):checked ~ .arrows > label:nth-of-type(10),
.csslider > input:nth-of-type(10):checked ~ .arrows > label:nth-of-type(11),
.csslider > input:nth-of-type(11):checked ~ .arrows > label:nth-of-type(12),
.csslider > input:nth-of-type(12):checked ~ .arrows > label:nth-of-type(13)
 
  {
    display: block;
    right: 0;
    left: auto;
    -moz-transform: rotate(225deg);
    -ms-transform: rotate(225deg);
    -o-transform: rotate(225deg);
    -webkit-transform: rotate(225deg);
    transform: rotate(225deg);
}
/* ul {
    padding-left: 40px;
} */

#slider1 > input:nth-of-type(3):checked ~ ul #bg {
    width: 80%;
    padding: 22px;
    -moz-transition: .5s .5s;
    -o-transition: .5s .5s;
    -webkit-transition: .5s .5s;
    transition: .5s .5s;
}
#slider1 > input:nth-of-type(3):checked ~ ul #bg div {
    -moz-transform: translate(0);
    -ms-transform: translate(0);
    -o-transform: translate(0);
    -webkit-transform: translate(0);
    transform: translate(0);
    -moz-transition: .5s .9s;
    -o-transition: .5s .9s;
    -webkit-transition: .5s .9s;
    transition: .5s .9s;
}
.banner-part{position: relative;}
.video-outer-homePage{position: absolute;height: 100%; width: 100%; left: 0; top: 0; object-fit: cover;}
video {
  
    height:400px;  
    background:transparent url('') no-repeat 0 0; 
    -webkit-background-size:cover; 
    -moz-background-size:cover; 
    -o-background-size:cover; 
    background-size:cover; 
}
.myvideo-wrapper{
    background: #000 !important;
}
iframe {
    border-radius: 0 15px 15px;
    height: 470px; overflow: hidden;
}
  .focus-division-two iframe {
    border-radius: 15px 0  0 15px;
    height: 470px; overflow: hidden;
}
/*videos*/

/*media query*/
@media(max-width:1200px) {
    .container {
        padding: 0px 16px;
    }

    .tab {
        gap: 30px;
    }

    .tabs-cont {
        padding: 0px 30px 0px 60px;
    }

    .cards-wrapper {
        grid-template-columns: 1fr 1fr 1fr;
    }
    .vdo-focuses .focus-one-conts {
        padding: 20px 20px !important;
    }
    .fhead{
        margin-bottom: 25px;
        line-height: 26px;
        font-size: 22px;
    }
    .vdo-focuses .video-rght, .vdo-focuses .vdo-lft{
        background: #000;
    }
    .myfhead{
        position: unset !important;
     }
}

@media(max-width:900px) {
    .tab {
        gap: 1px;
    }

    .tabs-img img {
        width: 100% !important;
    }

    .tabs-cont-two {
        padding: 0px 21px 0px 8px;
    }

    .cards-wrapper {
        grid-template-columns: 1fr 1fr;
    }
}
.main-carousel div.slide {
    flex: 0 0 200px;
    display: flex;
    width:200px; align-items: center; justify-content: center;
    margin-right:00px;
    height: 100px;
    overflow: hidden;
    border-radius: 6px;
    background: #fff;
}
 
@media(max-width:768px) {
    
   
    .vdo-focuses .focus-division-two, .vdo-focuses .focus-divisions{
        display: flex;
        flex-wrap: wrap;
        grid-template-columns:  1fr;
    }
.slide-videos, .focus-one-img,  .focus-border-three{ flex: 0 0 100%; order: 1; border-radius: 12px 12px 0 0 ;overflow: hidden; height: auto;}
.slide-videos iframe{ height: 310px;}

    .vdo-focuses .focus-one-conts{order: 2; flex: 0 0 100%;    border-radius: 0px 0px 15px 15px ;}
    .container {
        margin: unset;
    }

    .homepage .banner-part {
        background-image: url(../images/banner/mob-banner.png);
        background-position: center top !important;
        height: 756px;
        background-size: cover;
        background-repeat: no-repeat;
    }

    .scene-banner {
       height: 756px;
    }

    .divide {
        width: 100%;
    }

    .allcont-banner {
        grid-template-columns: 1fr;
    }

    .banner-part .heading {
        font-size: 24px;
        line-height: 35px;
        text-align: center;
    }

    .banner-part .para {
        line-height: 26px;
        font-size: 16px;
    }

    .primary-btn {
        padding: 13px 29px 13px 29px;
        font-size: 14px;
    }

    .secondary-btn {
        padding: 13px 29px 13px 29px;
        font-size: 14px;
    }

    .partners {
        padding: 45px 0px;
    }

    .partners .para {
        font-size: 24px;
        line-height: 40px;
    }

    .advantage {
        display: none;
    }

    .highlights {
        display: block;
    }

    .cards-wrapper {
        grid-template-columns: 1fr;
    }

    .empowers {
        padding: 45px 0px;
    }

    .empowers .head {
        font-size: 30px;
    }
    .empowers .head{
        margin-bottom: 38px;
    }
    .focus-one-img{
       margin-bottom: -4px;
    }

    .focus-one-cont {
        width: 100%;
        border-radius: 15px 15px 0px 0px;
        padding: 25px 22px 40px 20px;
    }

    .focus-one-img {
        width: 100%;
    }

    .fhead {
        font-size: 22px;
        margin-bottom: 15px;
        font-weight: bold;
        line-height: 26px;
    }

    .focuses .fcsbtn {
        padding: 11px 25px 11px 25px;
    }

    .focus-border-one,
    .focus-border-four {
        border-radius: 0px 0px 15px 15px;
    }

    .focus-border-two,
    .focus-border-three {
        border-radius: 15px 15px 0px 0px;
    }

    .focus-division {
        flex-direction: column-reverse;
    }

    .focus-division-two {
        display: unset;
    }

    .focuses .head {
        font-size: 30px;
        margin-bottom: 40px;
    }


    .fpara {
        font-size: 14px;
    }

    .focus-division {
        margin-bottom: 25px;
        margin-top: 25px;
    }

    .focuses .head {
        display: none;
    }

    .fcs-hdtwo {
        display: block;
        font-size: 30px;
        line-height: 42px;
        text-align: center;
        color: #fff;
        font-weight: bold;
        margin-bottom: 40px;
    }

    .focuses {
        padding: 60px 0px 48px 0px;
    }
 

    .banner-part .bann-btns {
        gap: 25px;
    }

    .allcont-banner {
        padding: 0px 0px 40px 0px;
    }

    .vdos {
        width: 100% !important;

    }

    .left_title {
        display: none;
    }
    .right_menu {
        position: relative;
        height: 51px;
        width: 100%;
 
    }
    .ML_sub_menu .right_menu ul li a {
        white-space: nowrap;
    }
    .ML_sub_menu .right_menu ul li a {
        padding: 14px 30px;
    }
    .right_menu {
        position: relative;
        height: 51px;
        width: 100%;
   
    }
    .ML_sub_menu .mmi-container {
        padding: 0;
    }
    .ML_sub_menu .right_menu ul{display: none;}
    .right_menu .arrowmobile {
        content: "";
        display: block;
        position: absolute;
        right: 0;
        top: 0;
        height: 100%;
        background-image: linear-gradient(to right,
                rgba(255, 0, 0, 0),
                rgba(255, 255, 255, 1) 75%);
        width: 32px;
        z-index: 19;
    }
    
    .right_menu .arrowmobile:after {
        content: "";
        display: block;
        position: absolute;
        right: 0;
        top: 0;
        height: 100%;
        background: url(https://cdn-public.mappls.com/about-mappls/assets/images/arrow-right.png) center center no-repeat;
        background-size: auto 28px;
        width: 32px;
        z-index: 20;
    }
    .video-outer-one {
        border-radius: 15px 15px 0px 0px !important;
    }
    .video-outer-two {
        border-radius: 15px 15px 0px 0px !important;
    }
    .product-slider{ overflow: hidden;
        border-radius: 15px 15px 0px 0px !important;
    }
    .product-slider-two {overflow: hidden;
        border-radius: 15px 15px 0px 0px !important;
    }
    .additional-video{
        border-radius: 10px 10px 0px 0px !important;
    }
    .additional-video-two{
        border-radius: 10px 10px 0px 0px !important;
    }
    .video-outer-homePage{    object-position: 71% -76%;}
    .banner-part  .container{   background: rgb(226,224,221);
        background: linear-gradient(180deg, rgba(226,224,221,0) 0%, rgba(95,95,213,0.47102591036414565) 36%, rgba(22,26,66,1) 100%);}
}

/*media query*/



/*media query*/


/*video owl slider*/
.product-slider{min-width: 50%; background: #fff; border-radius: 0px 15px 15px 0px;}
.product-slider-two {
    border-radius: 15px 0px 0px 15px;
}
.product-slider  .item{background-repeat: no-repeat;background-position: center center;background-size: cover;}
.sync1 .item{height: 300px;}
.sync2 .item{height: 117px;
  width: 100%;
  border: 1px solid #DDDDDD;}
.sync2 .owl-item.current{opacity: 1;} 
.sync2 .current{opacity: 1;}
.sync2 .owl-stage{display: flex;gap: 19px;}
.product-body{display: grid;grid-template-columns: 1fr 1fr;padding: 32px 0;gap: 32px;}
.product-images{
    width: 100%;
    height: 354px;
    background-size: contain;
    background-position: center center;
    border: 1px solid #E6E6E6;
    border-radius: 8px;
    background-repeat: no-repeat;
}
.product-image {
    width: 100%;
    height: 186px;
    background-size: contain;
    background-position: center center;
    background-repeat: no-repeat;
}

.p-50{padding-left: 50px;}
.dlvd{font-size: 13px;color: #339E82 !important;}


.owl-carousel button.owl-dot {
    color: #fff;
    border: 1px solid #2de0e0;
    padding: 0 !important;
    font: inherit;
    margin: 15PX 5px;
    width: 12px;
    height: 12px;
    border-radius: 10px;
    background: unset;
}
.owl-dots {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    width: 100%;
    bottom: 0px;
    border-radius: 0px;
    background: linear-gradient(181deg, rgb(18 18 18 / 46%) 18%, #021815 116%, rgb(68 68 68 / 88%) 77%);
    border-top: navajowhite;
}
.video-outer-one {
    border-radius: 0px 15px 0px 0px;
}
.video-outer-two{
    border-radius: 15px 0px 0px 0px;
}
button.owl-dot.active {
    background: #00be9f;
}
.brands-product video{
    width: 553px;
    display: block;
    height: 100%;
}
.additional-video{
    width: 100% !important;
    border-radius: 10px 0px 0px 10px;
}
.additional-video-two{
    width: 100% !important;
    border-radius: 0px 10px 10px 0px;
}
.owl-nav {
    position: absolute;
    top: 45%;
    width: 100%;
}
.owl-prev{
    color: #fff;
    font-size: 57px;
    left: -33px;
}
.owl-carousel .owl-prev, .owl-next{
/* pointer-events: none;
opacity: 0.2; */
color: #fff !important;
font-size: 57px !important;
}
.owl-prev {
    position: absolute;
    left: 8px;
}
.owl-next{
    right: 8px;
    position: absolute;
}
.owlbrands-product video{
    width: 563px !important;
    height: 100%;
}
.owl-carousel.owl-drag .owl-item {
    /* margin-right: unset !important; */
}
/*video owl slider*/