@font-face {
    font-family: "Conv_FontsFree-Net-SFProText-Bold";
    src: url("fonts/FontsFree-Net-SFProText-Bold.eot");
    src: local("â˜º"),
      url("../fonts/FontsFree-Net-SFProText-Bold.woff") format("woff"),
      url("../fonts/FontsFree-Net-SFProText-Bold.ttf") format("truetype"),
      url("../fonts/FontsFree-Net-SFProText-Bold.svg") format("svg");
    font-weight: normal;
    font-style: normal;
  }
  * {
    margin: 0;
    padding: 0;
  }
  body {
    font-family: "Arimo", sans-serif;
    /* color: rgb(196, 238, 12); */
    overflow-x: hidden;
    background: #000;
  }
  .wrapper {
    width: 100%;
    margin: 0 auto;
    position: relative;
    overflow-x: hidden;
  }
  .container {
    width: 1298px;
    margin: 0px auto;
    float: none;
    max-width: 100%;
    padding: 0px;
  }
  .carousel-1,
  .carousel-3,
  .carousel-4,
  .carousel-5 {
    background-repeat: no-repeat;
    background-position: center;
  }
  .carousel-1 {
    background-image: url(../images/carousel-bg-1.jpg);
  }
  .carousel-3 {
    background-image: url(../images/carousel-bg-3.jpg);
  }
  .carousel-4 {
    background-image: url(../images/carousel-bg-4.jpg);
  }
  .carousel-5 {
    background-image: url(../images/carousel-bg-5.jpg);
  }
  .carousel-main {
    padding: 84px 0px;
  }
  h1.h_title {
    color: #d6eff8;
    line-height: 1;
  }
  h1.h_title,
  h2.title {
    font-family: "Yantramanav", sans-serif;
    font-size: 69px;
    font-weight: 900;
    color: #d6eff8;
  }
  h2 {
    font-size: 69px;
    font-weight: bold;
  }
  h2.title {
    max-width: 461px;
    line-height: 1;
  }
  .carousel-caption p.title,
  p.title.green {
    font-size: 37px;
    max-width: 448px;
    font-weight: bold;
    line-height: normal;
  }
  .carousel-caption {
    bottom: -156px;
    left: 0%;
    padding-bottom: 20px;
    text-align: left;
  }
  .carousel-main.carousel-2,
  .carousel-main.carousel-6 {
    background-color: #000;
  }
  .caption-inner {
    position: absolute;
    top: 100px;
    width: auto;
    right: 100px;
  }
  .search-icon-con {
    text-align: center;
    position: relative;
    z-index: 1;
    margin-top: -100px;
    margin-left: 64px;
  }
  .carousel-head {
    position: relative;
    z-index: 2;
  }
  .carousel-2 .carousel-bottom {
    margin-top: -70px;
  }
  span.green {
    color: #28a288;
  }
  .carousel-3 .carousel-bottom {
    margin-top: 80px;
  }
  .carousel-4 .carousel-bottom,
  .carousel-5 .carousel-bottom,
  .carousel-6 .carousel-bottom {
    padding-top: 210px;
  }
  .carousel-4 .carousel-bottom h2.title {
    max-width: 891px;
  }
  .carousel-5 .carousel-head,
  .carousel-5 .carousel-bottom {
    padding-left: 40px;
  }
  .carousel-6 .carousel-bottom h2.title {
    max-width: 927px;
  }
  
  /********************* Toggle-Switch-css **************************/
  .toggle-con {
    text-align: center;
  }
  .toggle-con .switch {
    position: relative;
    display: inline-block;
    width: 64px;
    height: 24px;
    display: inline-block;
    margin: 0 28px;
  }
  
  .toggle-con .switch input {
    opacity: 0;
    width: 0;
    height: 0;
  }
  
  .toggle-con .slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #e9e9e9;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    z-index: 999;
  }
  
  .toggle-con .slider:before {
    position: absolute;
    content: "";
    height: 31px;
    width: 31px;
    left: -3px;
    bottom: -3px;
    background-color: #289c82;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    box-shadow: -5px 0px 9px #02513f;
  }
  
  .toggle-con input:checked + .slider {
    background-color: #e9e9e9;
  }
  .toggle-con input:focus + .slider {
    box-shadow: 0 0 1px #2196f3;
  }
  .toggle-con input:checked ~ .slider:before {
    -webkit-transform: translateX(38px);
    -ms-transform: translateX(38px);
    transform: translateX(38px);
  }
  
  /* Rounded sliders */
  .toggle-con .slider.round {
    border-radius: 34px;
  }
  
  .toggle-con .slider.round:before {
    border-radius: 50%;
  }
  .head-toggle {
    font-size: 16px;
    color: #289c82;
    position: absolute;
    top: 0px;
  }
  .head-toggle.left {
    left: -150px;
    top: 0px;
    color: #fff;
  }
  .head-toggle.right {
    right: -157px;
    top: 0px;
  }
  
  /************** END OF TOGGLE SWITCH *****************/
  
  /************Landing-page-css**********************/
  .full-width {
    width: 100%;
    float: left;
  }
  .inner-container {
    width: 1111px;
  }
  div#carousel-main {
    width: 100%;
    float: left;
    background-image: url(../images/bg2.png);
    background-size: contain;
    margin-bottom: 49px;
  }
  #carousel-main .carousel-indicators {
    bottom: 156px;
  }
  .top-strip {
    background: #000;
    width: 100%;
    /* float: left; */
    padding: 6px 0 12px 0;
    box-shadow: 1px 6px 14px #126e69;
    position: relative;
    z-index: 99;
  }
  .table_sec_main span.small-text {
    padding-top: 0px;
  }
  .time-left {
    width: auto;
    float: left;
    color: #fff;
  }
  .time-left span {
    font-size: 40px;
    font-weight: bold;
  }
  .time-right {
    width: auto;
    float: right;
  }
  .time-right img {
    width: 48px;
    margin-left: 15px;
  }
  .logo-con {
    float: left;
  }
  .logo-right,
  .logo-left {
    width: auto;
  }
  .logo-right {
    float: right;
    margin-top: 30px;
  }
  .logo-left {
    float: left;
  }
  .logo-left img {
    width: 82px;
  }
  .date-con {
    background: rgb(1, 62, 71);
    background: -moz-linear-gradient(
      0deg,
      rgba(1, 62, 71, 1) 0%,
      rgba(0, 0, 0, 1) 50%
    );
    background: -webkit-linear-gradient(
      0deg,
      rgba(1, 62, 71, 1) 0%,
      rgba(0, 0, 0, 1) 50%
    );
    background: linear-gradient(0deg, rgb(1, 62, 71) 0%, rgb(0, 0, 0) 50%);
  }
  .slider-con h1.h_title {
    max-width: 444px;
  }
  .slider-con .carousel-indicators {
    bottom: -54px;
  }
  .slider-con .carousel-indicators li {
    width: 59px;
    height: 6px;
    margin-right: 5px;
    margin-left: 5px;
    background-color: #01454f;
    opacity: 1;
  }
  .carousel-indicators {
    right: 0;
    bottom: 0;
    left: 0;
    justify-content: center;
    padding-left: 11%;
    margin-right: 0%;
    margin-left: 0%;
  }
  .slider-con .carousel-indicators li.active {
    background-color: #028982;
  }
  .slider-con .carousel-control-prev-icon,
  .slider-con .carousel-control-next-icon {
    display: none;
  }
  .s-title {
    font-size: 134px;
    color: #fff;
    line-height: 1;
    font-family: "Yantramanav", sans-serif;
  }
  .title.green {
    color: #289c82;
    padding-top: 2px;
  }
  .caption-right .counter span {
    font-size: 29px;
  }
  .caption-right .counter {
    width: auto;
    float: left;
  }
  .difference-con.full-width {
    padding-top: 98px;
  }
  .counter {
    margin-top: 38px;
  }
  .counter font {
    color: #289c82;
    font-size: 199px;
    line-height: 0.9;
    font-family: "Yantramanav", sans-serif;
  }
  .counter span {
    color: #fff;
    font-weight: bold;
    display: block;
    text-align: right;
    font-family: "Arimo", sans-serif;
    letter-spacing: 3px;
  }
  .counter span {
    color: #fff;
    font-weight: normal;
    display: block;
    text-align: center;
    font-family: "Arimo", sans-serif;
    letter-spacing: 12px;
    font-size: 29px;
  }
  .date-con .nav-tabs li {
    color: #fff;
    font-size: 16px;
    text-transform: uppercase;
  }
  .date-con .row span:nth-child(1n) {
    padding-left: 20px;
  }
  .date-con .row span:nth-child(4n) {
    padding-right: 20px;
  }
  .date-con.full-width {
    margin: 89px 0 50px 0;
    padding-bottom: 90px;
  }
  .border-con {
    border-bottom: 1px solid #299c83;
    position: relative;
    margin-top: 5px;
  }
  .border-con .top-border {
    background: linear-gradient(
      90deg,
      rgba(3, 73, 81, 1) 0%,
      rgba(39, 154, 130, 1) 100%
    );
    width: 180px;
    display: block;
    height: 12px;
  }
  .date-con .nav-tabs .nav-item.show .nav-link,
  .nav-tabs .nav-link.active {
    background-color: transparent;
    font-weight: bold;
  }
  .date-con .nav-tabs .nav-link.active span.top-border {
    background: linear-gradient(
      90deg,
      rgba(3, 73, 81, 1) 0%,
      rgba(39, 154, 130, 1) 100%
    );
    width: 280px;
    display: block;
    height: 5px;
    border: 0px;
    padding-top: 4px;
    position: relative;
    top: 4px;
  }
  .date-con .nav-tabs .nav-item a {
    color: #2a9d83;
  }
  .date-con .nav-tabs .nav-item a.active {
    color: #fff;
  }
  .date-con .nav-tabs {
    border-bottom: 1px solid #299c83;
    padding-bottom: 5px;
  }
  .date-con .nav-tabs .nav-link {
    border: 0px;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    padding: 0px;
  }
  .tab-col {
    width: 50%;
    float: left;
  }
  #myTabContent {
    margin-top: 55px;
  }
  .date-con .row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-right: 0px;
    margin-left: 0px;
    justify-content: space-between;
    text-align: center;
  }
  .dolors-con,
  .water-con,
  .energy-con,
  .oil-con,
  .gas-con {
    text-align: right;
    color: #fff;
    font-family: "Yantramanav", sans-serif;
    font-weight: 500;
  }
  .energy-con .pull-down-left {
    right: 0px;
  }
  .oil-con .pull-down-left,
  .gas-con .pull-down-left {
    right: 0px;
  }
  .dolors-con h3 {
    color: #289c82;
  }
  .dolors-con h3,
  .water-con h3,
  .energy-con h3,
  .oil-con h3,
  .gas-con h3 {
    position: relative;
    font-size: 44px;
    font-weight: bold;
    color: #289c82;
    text-transform: uppercase;
  }
  .water-con img,
  .energy-con img,
  .oil-con img,
  .gas-con img {
    width: 32px;
    margin-right: 3px;
  }
  .water-con h3 {
    color: #33c5ff;
  }
  .energy-con h3 {
    color: #a8da32;
  }
  .oil-con h3 {
    color: #f4c816;
  }
  .gas-con h3 {
    color: #ef7d0f;
  }
  .pull-up {
    top: -4px;
    left: -3px;
  }
  .pull-up,
  .pull-down {
    font-size: 23px;
    text-transform: uppercase;
    font-weight: 100;
    font-family: "Arimo", sans-serif;
    letter-spacing: 2px;
    position: relative;
  }
  .pull-down {
    bottom: 3px;
  }
  .pull-down {
    margin-left: 5px;
  }
  .pull-down-left {
    position: absolute;
    bottom: -32px;
    font-size: 29px;
    right: -1px;
    font-weight: 500;
    color: #126e69;
  }
  h3 font {
    font-size: 40px;
    font-weight: 500;
  }
  .date-con h3 font {
    font-size: 61px;
    font-weight: 500;
    display: block;
    line-height: 1;
  }
  .water-con,
  .energy-con {
    margin-bottom: 90px;
  }
  .water-con h3 font {
    font-size: 65px;
    font-weight: 500;
    line-height: 1;
  }
  .water-con.full-width {
    padding-right: 30px;
  }
  .oil-con.full-width,
  .gas-con.full-width {
    padding-right: 55px;
  }
  .property-con {
    background: #000;
    margin-top: 54px;
    padding-bottom: 50px;
  }
  .property-left,
  .difference-left {
    width: 50%;
    float: left;
  }
  .property-left h2.title {
    max-width: 431px;
    font-size: 37px;
    font-family: "Arimo", sans-serif;
  }
  .property-right,
  .difference-right {
    width: 50%;
    float: right;
  }
  .button-con .btn-btn.bottom-btn a {
    margin: 52px 0px;
  }
  .difference-left h2.title {
    margin-top: 12px;
  }
  .counter {
    width: auto;
    float: right;
  }
  .property-con .para p {
    color: #d0e9f2;
    font-size: 23px;
    line-height: 1.3;
    letter-spacing: 2px;
    max-width: 437px;
  }
  .full-width.para {
    width: 759px;
    margin-top: 30px;
  }
  .btn-btn.bottom-btn.full-width {
    text-align: center;
    margin: 22px 0;
  }
  .btn-btn a {
    font-size: 23px;
    background: linear-gradient(
      0deg,
      rgba(3, 73, 81, 1) 0%,
      rgba(39, 154, 130, 1) 100%
    );
    border-radius: 10px;
    padding: 10px;
    max-width: 380px;
    display: block;
    margin: 0 auto;
    color: #fff;
    text-decoration: none;
    text-align: center;
  }
  a {
    text-decoration: none;
    color: #1e1e23;
    opacity: 1;
  }
  a:hover {
    opacity: 0.5;
  }
  ul {
    padding: 0;
    list-style-type: none;
  }
  
  nav {
    background-color: transparent;
  }
  #menuToggle {
    display: flex;
    flex-direction: column;
    top: 5px;
    left: 33px;
    z-index: 1;
    -webkit-user-select: none;
    user-select: none;
    position: absolute;
  }
  
  #menuToggle input {
    display: flex;
    width: 48px;
    height: 32px;
    position: absolute;
    cursor: pointer;
    opacity: 0;
    z-index: 9999;
    top: -6px;
  }
  #menuToggle span {
    display: flex;
    width: 37px;
    height: 2px;
    margin-bottom: 6px;
    position: relative;
    background: #20917f;
    border-radius: 3px;
    z-index: 999;
    transform-origin: 5px 0px;
    transition: transform 0.5s cubic-bezier(0.77, 0.2, 0.05, 1),
      background 0.5s cubic-bezier(0.77, 0.2, 0.05, 1), opacity 0.55s ease;
  }
  
  #menuToggle span:first-child {
    transform-origin: 0% 0%;
  }
  
  #menuToggle span:nth-last-child(2) {
    transform-origin: 0% 100%;
  }
  
  #menuToggle input:checked ~ span {
    opacity: 1;
    transform: rotate(45deg) translate(2px, -3px);
    background: #20c2b5;
  }
  #menuToggle input:checked ~ span:nth-last-child(3) {
    opacity: 0;
    transform: rotate(0deg) scale(0.2, 0.2);
  }
  
  .carousel-inner {
    z-index: -1;
    background: rgb(19, 77, 85);
    background: -moz-linear-gradient(
      94deg,
      rgba(19, 77, 85, 1) 0%,
      rgba(0, 0, 0, 1) 43%
    );
    background: -webkit-linear-gradient(
      94deg,
      rgba(19, 77, 85, 1) 0%,
      rgba(0, 0, 0, 1) 43%
    );
    background: linear-gradient(
      94deg,
      rgba(19, 77, 85, 1) 0%,
      rgba(0, 0, 0, 1) 43%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#134d55",endColorstr="#000000",GradientType=1);
  }
  .slider-con .carousel-inner {
    overflow: visible;
  }
  img {
    max-width: 100%;
  }
  .d-block.w-100 {
    width: 700px !important;
    margin-bottom: -115px;
  }
  .background-con {
    background: rgb(1, 45, 51);
    background: -moz-linear-gradient(
      0deg,
      rgba(1, 45, 51, 1) 2%,
      rgba(0, 0, 0, 1) 24%,
      rgba(1, 1, 1, 1) 80%,
      rgba(1, 45, 51, 1) 100%
    );
    background: -webkit-linear-gradient(
      0deg,
      rgba(1, 45, 51, 1) 2%,
      rgba(0, 0, 0, 1) 24%,
      rgba(1, 1, 1, 1) 80%,
      rgba(1, 45, 51, 1) 100%
    );
    background: linear-gradient(
      0deg,
      rgba(1, 45, 51, 1) 2%,
      rgba(0, 0, 0, 1) 24%,
      rgba(1, 1, 1, 1) 80%,
      rgba(1, 45, 51, 1) 100%
    );
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#012d33",endColorstr="#012d33",GradientType=1);
    padding-bottom: 170px;
  }
  .button-left.col-6 {
    width: 50%;
    float: left;
  }
  .property-right h3 {
    font-size: 37px;
    color: #d0e9f2;
    max-width: 400px;
    line-height: 1.2;
  }
  .button-right.col-6 {
    width: 50%;
    float: right;
  }
  .user-con .col-6 {
    width: 50%;
    float: left;
    padding: 10px 11px;
    height: 337px;
    margin: 40px 0 18px 0;
  }
  .user-con .col-6 h4 {
    font-size: 22px;
    color: #9eb8c7;
    margin: 30px 0px 24px;
    font-family: "Yantramanav", sans-serif;
    font-weight: 400;
    letter-spacing: 2px;
  }
  .user-con .col-6 p {
    font-size: 18px;
    color: #2a9d83;
    letter-spacing: 1px;
    line-height: 22px;
  }
  .property-con .bottom-row p {
    font-size: 23px;
    line-height: 1.3;
    letter-spacing: 2px;
    color: #d0e9f2;
    max-width: 450px;
  }
  .live-data-con img {
    float: right;
    width: 100%;
    padding-left: 53px;
  }
  .live-data-con h2.title.green,
  .compare-con h2.title.green {
    font-family: "Yantramanav", sans-serif;
    max-width: 100%;
  }
  .compare-con.full-width {
    padding: 95px 0 65px;
  }
  .compare-con .head-top.full-width {
    margin-bottom: 58px;
  }
  .compare-con h2.title.green {
    padding-top: 0px;
    line-height: 20px;
    padding-left: 18px;
  }
  .live-data-con h3 {
    font-size: 37px;
    color: #d0e9f2;
  }
  .head-top.full-width {
    padding-left: 10%;
    margin-bottom: 30px;
  }
  .compare-con h4 {
    font-size: 22px;
    line-height: 26px;
    color: #9eb8c7;
    font-family: "Yantramanav", sans-serif;
    letter-spacing: 1.2px;
    margin-bottom: 28px;
    padding: 0 20px;
    font-weight: 400;
  }
  .col-2 {
    width: calc(20% - 4px);
    float: left;
    max-width: 100%;
    background: #2a2f30;
    margin-right: 5px;
    padding: 15px;
    min-height: 665px;
  }
  .col-2.third-col h4 {
    color: #289c82;
  }
  .col-2.third-col {
    border: 2px solid #2a9d83;
  }
  .col-2:last-child {
    margin-right: 0px;
  }
  .compare-con .col-2 li {
    font-size: 16px;
    color: #d0e9f2;
    line-height: 19px;
    letter-spacing: 1.1px;
    padding-bottom: 22px;
    background-image: url(../images/close-icon.png);
    background-repeat: no-repeat;
    background-position: left top;
    padding-left: 34px;
    background-size: 24px;
  }
  .compare-con .col-2.first-col li:nth-child(6n),
  .compare-con .col-2 ul li.tick-icon,
  .compare-con .col-2.third-col li {
    background-image: url(../images/tick-icon.png);
  }
  ul.social-icon,
  .social-icon li,
  ul.f-menu,
  .f-menu li,
  ul.logo-text,
  .logo-text li {
    display: inline-block;
  }
  .social-icon {
    padding-left: 80px;
    position: relative;
    top: 13px;
  }
  ul.social-icon li {
    padding: 10px;
    color: #fff;
  }
  ul.social-icon li a {
    color: #fff;
  }
  .footer-inner .logo-con img {
    width: 100px;
  }
  .logo-text span li {
    display: block;
    font-size: 22px;
    color: #2a9d83;
    font-family: "Yantramanav", sans-serif;
    text-transform: uppercase;
    line-height: 13px;
    letter-spacing: 2px;
  }
  .logo-text li {
    color: #2a9d83;
    font-size: 13px;
  }
  .logo-text {
    position: relative;
    top: 23px;
  }
  .footer-inner {
    width: 100%;
    margin: 0 auto;
    max-width: 800px;
  }
  .footer-con.full-width {
    padding-top: 86px;
  }
  .footer-menu.full-width {
    padding: 64px 0 15px 0;
  }
  ul.f-menu li {
    font-family: "Yantramanav", sans-serif;
  }
  .f-menu li {
    padding: 0 164px 32px 0px;
  }
  .f-menu li a {
    color: #2a9d83;
  }
  .copy-con.full-width {
    margin-top: 70px;
  }
  .copy-con.full-width p,
  .bottom-para p {
    color: #9eb8c7;
    font-family: "Yantramanav", sans-serif;
  }
  .bottom-para.full-width {
    margin-top: 14px;
  }
  .live-data-con.full-width {
    margin-top: 60px;
  }
  .live-data-con .head-top {
    padding-left: 6%;
  }
  .carousel-control-prev,
  .carousel-control-next {
    display: none;
  }
  
  /* Jatin */
  /* Mobile Compare*/
  .compare-con li {
    font-size: 16px;
    color: #fff;
    line-height: 19px;
    letter-spacing: 1.1px;
    padding-bottom: 22px;
    background-image: url(../images/close-icon.png);
    background-repeat: no-repeat;
    background-position: left top;
    padding-left: 34px;
    background-size: 24px;
  }
  .compare-con ul li.tick-icon,
  .third-col ul li {
    background-image: url(../images/tick-icon.png);
  }
  
  /** ---- S E R V I C E    C S S    S T A R T ---- **/
  h2.tint_txt_color {
    color: #bcd5de;
  }
  .time_save h3 {
    font-size: 69px;
    font-family: "Yantramanav", sans-serif;
    color: #d0e9f2;
    font-weight: bold;
    line-height: 67px;
    padding-top: 11px;
  }
  span.small-text {
    color: #9eb8c7;
    padding-top: 44px;
    display: block;
    font-family: "Yantramanav", sans-serif;
    font-size: 22px;
    letter-spacing: 1.3px;
  }
  .image-block span {
    font-size: 9px;
    display: inline-block;
    position: relative;
    top: -5px;
  }
  
  .small-img img {
    width: 16px;
  }
  .col-md-12.top-popup-secn {
    padding-right: 0;
  }
  span.cross-icontext {
    color: #2a9d83;
    text-align: center;
    display: block;
    font-size: 14px;
    padding-top: 19px;
    font-family: "Arimo", sans-serif;
    letter-spacing: 1.3px;
  }
  .prefer-sec p {
    color: #fff;
    text-align: right;
    font-style: italic;
    padding-top: 25px;
  }
  .main-sec-water.bottom-main.border-remove {
    border-bottom: 0;
  }
  span.live_ris {
    color: #1763a0;
    text-align: center;
    display: block;
    padding-top: 9px;
    padding-bottom: 0px;
    font-size: 13px;
    font-weight: bold;
    font-family: "Yantramanav", sans-serif;
  }
  .table_sec_main .slider-text {
    padding-left: 32px;
    padding-bottom: 15px;
  }
  span.live_poins {
    color: #45ac7d;
    text-align: center;
    display: block;
    padding-top: 9px;
    padding-bottom: 0px;
    font-size: 13px;
    font-weight: bold;
    font-family: "Yantramanav", sans-serif;
  }
  span.live_both {
    color: #2a9d83;
    text-align: center;
    display: block;
    padding-top: 9px;
    padding-bottom: 0px;
    font-size: 13px;
    font-weight: bold;
    font-family: "Yantramanav", sans-serif;
  }
  .tanle-content img {
    width: 51px;
    margin: 0 auto;
    display: block;
    position: relative;
    top: 8px;
  }
  .main-sec-water {
    border-bottom: 1px dashed #575b5b;
    padding: 3px 0 21px 29px;
  }
  section.table_sec_main {
    padding: 0 120px 89px 120px;
  }
  span.cross-icon {
    display: block;
    text-align: center;
    padding-top: 12px;
  }
  .cross-icon i.fas.fa-check {
    color: #fff;
    background-color: #30a086;
    width: 28px;
    height: 28px;
    line-height: 30px;
    border-radius: 100px;
    font-weight: 600;
    font-size: 11px;
  }
  .cross-icon i.fas.fa-times {
    color: #fff;
    line-height: 30px;
    border-radius: 100px;
  }
  .tanle-content p {
    color: #d0e9f2;
    padding-top: 20px;
    margin-bottom: 0;
    font-size: 10px;
    font-family: "Arimo", sans-serif;
    letter-spacing: 2px;
  }
  .popup-content-sec.color-design.colo_box10 {
    background: linear-gradient(-45deg, #024750, #269881);
  }
  .popup-content-sec.color-design.cole6_cox {
    background: linear-gradient(-45deg, #43ad82, #1768a2);
  }
  .popup-content-sec.color-design.corl_box9 {
    background: linear-gradient(to right, #279b82, #b7182d);
  }
  .popup-content-sec.color-design.box3_color {
    background: linear-gradient(-45deg, #ba182b, #eb7911);
  }
  .popup-content-sec.color-design.box4_color {
    background: linear-gradient(-45deg, #f4c416, #ee7e10);
  }
  .popup-content-sec.color-design.box_7color {
    background: linear-gradient(-45deg, #aada31, #fcee17);
  }
  .popup-content-sec.color-design.box5_color {
    background: linear-gradient(-45deg, #44ac7f, #196ca6);
  }
  .popup-content-sec.color-design.box2_color {
    background: linear-gradient(to right, #024850, #259780);
  }
  .box1_color {
    background: linear-gradient(to right, #2a3031, #9ab4c2) !important;
  }
  .box.gradient-box.sytle-border1 a:before {
    background: linear-gradient(to right, #024750, #1e857c);
  }
  .box.gradient-box.box.gradient-box.sytle-border3 a:before {
    background: linear-gradient(to right, #45ac7d, #33c4fe);
  }
  .row.popup-csetio {
    margin: 8px 14px 0 12px;
  }
  .sytle-border3 a.button {
    color: #33c5ff;
  }
  .box.gradient-box.box.gradient-box.sytle-border4 a:before {
    background: linear-gradient(to right, #279b82, #01454f);
  }
  .sytle-border4 a.button {
    color: #289c82;
  }
  .sytle-border5 a.button {
    color: #33c5ff;
  }
  .box.gradient-box.box.gradient-box.sytle-border5 a:before {
    background: linear-gradient(to right, #2aa8e2, #16659f);
  }
  .box.gradient-box.box.gradient-box.sytle-border6 a:before {
    background: linear-gradient(to right, #fbee18, #aada31);
  }
  .button-popup a:hover {
    text-decoration: none;
    color: #ffffff !important;
  }
  
  .sytle-border6 a.button {
    color: #a8da32;
  }
  .sytle-border7 a.button {
    color: #ee7e10;
  }
  .sytle-border8 a.button {
    color: #ba202e;
  }
  .box.gradient-box.box.gradient-box.sytle-border8 a:before {
    background: linear-gradient(to right, #e77113, #bb1a2a);
  }
  .box.gradient-box.box.gradient-box.sytle-border7 a:before {
    background: linear-gradient(to right, #f4c716, #f09712);
  }
  .sytle-border1 a.button {
    color: #289c82;
  }
  .box.gradient-box.sytle-border2 a:before {
    background: linear-gradient(to right, #fcee17, #a8da31);
  }
  .box.gradient-box.sytle-border2 a.button {
    color: #289c82;
  }
  .box.gradient-box.sytle-border2 a:before {
    background: linear-gradient(to right, #279b82, #b7182d);
  }
  .wrapper {
    width: 100%;
    margin: 0 auto;
    position: relative;
    overflow-x: initial;
  }
  .row.inner-popupss {
    margin-top: 16px;
  }
  .inner-popupss .col-md-6 {
    padding-right: 0;
  }
  .inner-popupss .col-md-2 {
    padding-right: 0;
  }
  .inner-popupss .col-md-4 {
    padding-right: 0;
  }
  .image-block {
    float: left;
  }
  .time_save p {
    padding-top: 79px;
    font-family: "Arimo", sans-serif;
    color: #d0e9f2;
    font-size: 23px;
    line-height: 33px;
    letter-spacing: 2px;
  }
  .text-dsd {
    overflow: hidden;
    padding-left: 13px;
    padding-top: 0px;
  }
  .popup-content-sec h4.orf {
    color: #ee8510;
  }
  .popup-content-sec h4 {
    margin-bottom: 7px;
    color: #45ad7d;
    font-size: 13px;
    font-weight: bold;
    letter-spacing: 2px;
    display: inherit;
    text-align: center;
  }
  .overlay:target {
    overflow-y: scroll;
  }
  .popup-content-sec p {
    color: #d0e9f2;
    font-size: 13px;
    line-height: 24px;
    margin-bottom: 0;
    letter-spacing: 2px;
  }
  span.color-text {
    color: #28a187;
    font-weight: bold;
  }
  .popup-content-sec.color-design2 {
    background: linear-gradient(-45deg, #15635d, #176a61, #072f3e, #000a0c);
    margin-top: 14px;
    opacity: 0.9;
  }
  .slider-text {
    padding-left: 126px;
  }
  .slider-text h3 {
    color: #289c82;
    font-weight: bold;
    font-size: 69px;
    font-family: "Yantramanav", sans-serif;
  }
  .image-block img {
    width: 100px;
    margin: 0 auto;
    display: block;
  }
  .text-slide {
    max-width: 74%;
    padding: 0px 60px 0 163px;
    margin: 0 auto;
  }
  .popup-content-sec {
    padding-bottom: 60px !important;
  }
  span.color-text.gas {
    color: #f18929;
    padding-right: 9px;
  }
  
  span.color-text.rise {
    color: #14619f;
    padding-right: 9px;
  }
  
  span.color-text.point {
    color: #40a977;
    padding-right: 9px;
  }
  #carousel-main p.title {
    color: #d3ecf5;
    width: 100%;
    padding-top: 35px;
    font-family: "Arimo", sans-serif;
    letter-spacing: 2px;
    font-size: 23px;
    line-height: 36px;
  }
  #carousel-main p.title br {
    display: none;
  }
  span.color-text.olis {
    color: #a8da32;
    padding-right: 9px;
  }
  .middle-img {
    padding-right: 9px;
  }
  #carousel-main img.d-block.w-100 {
    width: 40% !important;
    margin: 0 auto;
    margin-top: 25px;
  }
  .color-design {
    background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
  }
  .popup-content-sec {
    box-shadow: 5px 5px 10px;
    border-radius: 20px;
    padding: 25px;
  }
  .popup-content-sec.color-design2.hig-sec {
    min-height: 200px;
  }
  .image_save img {
    width: 80%;
    margin: 0 auto;
    display: block;
    padding-top: 0;
    margin-top: -38px;
  }
  .time_save.mobile-show {
    display: none;
  }
  section.building-block-sec {
    padding-left: 120px;
    padding-bottom: 90px;
    overflow: hidden;
    padding-right: 120px;
    width: 100%;
  }
  .image_save {
    float: left;
    width: 50%;
  }
  .time_save.desktop-show {
    width: 50%;
    float: right;
  }
  .time_save.desktop-show {
    padding-left: 45px;
  }
  .block_text h3 {
    font-size: 69px;
    color: #289c82;
    font-family: "Yantramanav", sans-serif;
    font-weight: bold;
  }
  .building-block-sec span.small-text {
    padding-top: 51px;
  }
  .block_text p {
    color: #d0e9f2;
    font-size: 22px;
    font-family: "Arimo", sans-serif;
    letter-spacing: 2px;
  }
  #carousel-main .carousel-inner {
    z-index: 99;
    background: transparent !important;
  }
  #carousel-main .carousel {
    position: relative;
    padding-bottom: 245px;
  }
  .gradient-box a {
    width: 100%;
    position: relative;
    padding: 23px 9px;
    box-sizing: border-box;
    color: #fff;
    background: #000;
    background-clip: padding-box;
    border: solid 2px transparent;
    border-radius: 21px;
    text-align: center;
    margin: 0 auto;
    display: block;
    font-family: "Arimo", sans-serif;
    font-weight: 400;
    font-size: 15px;
    letter-spacing: 1px;
  }
  .gradient-box a:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
    margin: -3px;
    border-radius: inherit;
    background: linear-gradient(to right, #2a3031, #9ab4c2);
  }
  .row.popup-csetion {
    width: 100%;
  }
  .button-popup a {
    text-decoration: none;
    color: #d0e9f2;
    opacity: 1;
  }
  .button:hover {
    background: transparent;
  }
  .overlay {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.7);
    transition: opacity 500ms;
    visibility: hidden;
    opacity: 0;
  }
  .overlay:target,
  .modal:target {
    visibility: visible;
    opacity: 1;
    z-index: 999;
  }
  h4.grenn {
    color: #abdb33;
  }
  .blck-color {
    color: #2a2f30 !important;
  }
  .popup {
    margin: 10px auto;
    padding: 20px;
    background: transparent;
    border-radius: 5px;
    width: 70%;
    position: relative;
    transition: all 5s ease-in-out;
  }
  .popup h2 {
    margin-top: 0;
    color: #fff;
    font-size: 14px;
    letter-spacing: 2px;
  }
  #popup9 .popup h2 {
    color: #d6eff8;
  }
  #popup4 .popup h2,
  .popup-content-sec .charcoal-color,
  .popup-content-sec.color-design.box_7color p {
    color: #2a2f30 !important;
  }
  .popup .close {
    position: absolute;
    top: -5px;
    right: 10px;
    transition: all 200ms;
    font-size: 30px;
    font-weight: 100;
    text-decoration: none;
    color: #fff;
    background-color: #289c82;
    border-radius: 100px;
    width: 30px;
    height: 30px;
    text-align: center;
  }
  .popup .close:hover {
    color: #06d85f;
  }
  .popup .content {
    max-height: 30%;
  }
  #carousel-main .carousel-indicators {
    padding-left: 0;
  }
  span.star {
    color: #fff;
    padding-left: 6px;
    position: relative;
    left: -1px;
    top: -9px;
  }
  span.cross-icon.start {
    padding-left: 18px;
  }
  .text-mobile p {
    padding-top: 55px;
    font-family: "Arimo", sans-serif;
    color: #d0e9f2;
    font-size: 19px;
    display: none;
    letter-spacing: 2px;
  }
  .text-mobile p br {
    display: none;
  }
  
  .building-block-sec span.small-text {
    padding-top: 44px;
  }
  .main-sec-water .col-2 {
    width: auto;
    float: none;
    max-width: 100%;
    background: transparent;
    margin-right: 0;
    padding: 0;
    min-height: auto;
  }
  span.samlltext {
    font-size: 12px;
  }
  .popup-csetio .col-2 {
    width: auto;
    float: none;
    max-width: 100%;
    background: transparent;
    margin-right: 0;
    min-height: auto;
    padding-top: 0;
    padding-bottom: 0;
  }
  section.save-time-sec {
    background-image: url(../images/back1.jpg);
    background-size: cover;
  }
  
  #carousel-main .carousel-inner {
    background-image: url(../images/bg2.png);
    background-size: cover;
  }
  span.color-text.water-text {
    color: #41bbe9;
    padding-right: 9px;
  }
  .footer-con.full-width {
    padding-top: 55px;
    background-image: url(../images/bg_footer.png);
    background-size: cover;
  }
  span.color-text.liverise {
    color: #f49f12;
  }
  span.color-text.darkBlueColor {
    color: #1664a4;
  }
  span.color-text.colorYellow {
    color: #aee032;
  }
  .color-text img {
    width: 30px;
    padding-right: 9px;
  }
  h4.liveWaterLightBlue {
    color: #33c7ff;
  }
  h4.liveRiseDarkBlue {
    color: #16649f;
  }
  h4.leakDetDarkBlue {
    color: #1763a1;
  }
  #popup5 .popup-content-sec p,
  #popup7 .popup-content-sec p,
  #popup9 .popup-content-sec p,
  #popup1 .popup h2,
  #popup2 .popup h2,
  #popup10 .popup h2 {
    color: #bcd5de;
  }
  
  .mobileViewOnly{
    display: none;
  }
  /** ---- S E R V I C E    C S S    E N D ---- **/
  
  /******************************Responsive-Css-Start****************************************/
  
  @media screen and (max-width: 1280px) {
    .container {
      width: 94%;
    }
  }
  @media screen and (max-width: 1200px) {
    #menu {
      width: 85%;
      min-width: 340px;
      position: fixed;
      margin: -30px 0 0 85%;
      right: 0px;
      height: 100%;
      overflow-y: auto;
      z-index: 99;
      background: rgb(0, 0, 0);
      background: -moz-linear-gradient(
        110deg,
        rgba(0, 0, 0, 0.9108777299982493) 20%,
        rgba(27, 127, 117, 0.8268441165528712) 83%
      );
      background: -webkit-linear-gradient(
        110deg,
        rgba(0, 0, 0, 0.9108777299982493) 20%,
        rgba(27, 127, 117, 0.8268441165528712) 83%
      );
      background: linear-gradient(
        110deg,
        rgba(0, 0, 0, 0.9108777299982493) 20%,
        rgba(27, 127, 117, 0.8268441165528712) 83%
      );
      filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#1b7f75",GradientType=1);
      padding-top: 100px;
    }
    .menu-item {
      width: calc(100% - 100px);
      width: -webkit-calc(100% - 100px);
      padding: 7px 50px;
    }
    .menu-item.menu-item-has-children {
      background-position: right 33px;
      background-size: 3%;
    }
    .menu-item.menu-item-has-children:hover {
      background-position: right 33px;
      background-size: 5%;
    }
    li.menu-item a {
      font-size: 60px;
    }
    .sub-menu {
      background: none;
      position: static;
      width: 100%;
    }
    #menu .menu-item.menu-item-has-children.double .sub-menu {
      flex-wrap: wrap;
      -moz-column-count: 1;
      -moz-column-gap: 0px;
      -webkit-column-count: 1;
      -webkit-column-gap: 0px;
      column-gap: 0px;
      column-count: 1;
      width: 100%;
    }
    li.menu-item .sub-menu li a {
      font-size: 30px;
    }
  }
  @media screen and (min-width: 768px) and (max-width: 1024px) {
    .compare-con .col-2.first-col li:nth-child(6n),
    .compare-con .col-2 ul li.tick-icon,
    .compare-con .col-2.third-col li {
      background-size: 45px;
      padding-left: 50px;
    }
  }
  @media screen and (max-width: 1024px) {
    .slider-con h1.h_title {
      max-width: 760px;
      font-size: 117px;
    }
    .caption-inner {
      top: 97px;
      width: 97%;
      left: 3%;
    }
    .carousel-caption {
      right: 0%;
      bottom: -217px;
      left: 0%;
    }
    .carousel-caption h2 {
      font-size: 65px;
      max-width: 100%;
    }
    .difference-inner .s-title {
      font-size: 96px;
      max-width: 755px;
    }
    h2.title.green {
      font-size: 74px;
      max-width: 866px;
    }
    .slider-con .carousel-inner .d-none h2 {
      padding: 0 10px;
    }
    .slider-con .carousel-indicators {
      bottom: -67px;
    }
    .counter span {
      font-size: 58px;
      font-weight: bold;
      letter-spacing: 25px;
    }
    .date-con .nav-tabs li {
      font-size: 32px;
    }
    .date-con .nav-tabs .nav-link.active span.top-border {
      width: 180px;
      height: 12px;
    }
    .dolors-con h3,
    .water-con h3,
    .energy-con h3,
    .oil-con h3,
    .gas-con h3 {
      font-size: 89px;
      font-weight: bold;
    }
    .dolors-con h3 font {
      font-size: 80px;
    }
    .water-con h3 font {
      font-size: 130px;
    }
    .date-con h3 font {
      font-size: 122px;
      line-height: 0.7;
    }
    .pull-up,
    .pull-down {
      font-size: 45px;
    }
    .pull-up {
      top: -16px;
    }
    .pull-down {
      bottom: 14px;
    }
    .pull-down-left {
      bottom: -75px;
      font-size: 58px;
      right: 0px;
    }
    .energy-con .pull-down-left {
      right: 257px;
    }
    .oil-con .pull-down-left,
    .gas-con .pull-down-left {
      right: 150px;
    }
    .oil-con.full-width,
    .gas-con.full-width {
      padding-right: 149px;
    }
    .water-con {
      margin-top: 52px;
    }
    .oil-con,
    .gas-con {
      margin: 130px 0;
    }
    .btn-btn a {
      font-size: 46px;
      padding: 10px;
      max-width: 690px;
    }
    .caption-left {
      width: 100%;
      max-width: 100%;
      padding-left: 74px;
    }
    .d-block.w-100 {
      width: 800px !important;
      margin-bottom: 0px;
    }
    .carousel-caption p.title,
    p.title.green {
      font-size: 59px;
      max-width: 828px;
    }
    .difference-left p.title.green {
      max-width: 727px;
    }
  
    .property-left,
    .property-right,
    .button-right.col-6,
    .button-left.col-6,
    .user-con .col-6 {
      width: 100%;
      max-width: 100%;
    }
    .user-con .col-6 {
      height: auto;
    }
    .property-right {
      position: static;
      margin-top: 12px;
    }
    .property-left {
      padding-left: 60px;
    }
    .full-width.para {
      width: 799px;
    }
    .property-con .para p {
      font-size: 46px;
      max-width: 100%;
    }
    .button-right.col-6 {
      margin: 40px 0 55px 0;
    }
    .button-left.col-6 h3 {
      font-size: 74px;
      color: #289c82;
      max-width: 850px;
      font-weight: bold;
    }
    .user-con .col-6 img {
      float: left;
      width: 320px;
      margin-top: 15px;
    }
    .user-con .col-6 p {
      font-size: 36px;
      line-height: 48px;
      letter-spacing: 3px;
    }
    .user-con .col-6 h4 {
      font-size: 43px;
      letter-spacing: 6px;
      margin-top: 15px;
    }
    .user-con .col-6 h4,
    .user-con .col-6 p {
      display: flex;
      padding-left: 86px;
    }
    .property-con .bottom-row p {
      font-size: 46px;
      line-height: 61px;
      letter-spacing: 4.1px;
      max-width: 900px;
      margin-top: 50px;
    }
    .live-data-con.full-width {
      padding-top: 40px;
    }
    .live-data-con h2.title.green {
      font-size: 132px;
      line-height: 140px;
    }
    .live-data-con h3 {
      font-size: 75px;
      font-weight: bold;
      margin-top: 22px;
    }
    .live-data-con img {
      margin-top: 25px;
      width: 1405px;
      position: relative;
      right: -419px;
      max-width: none;
    }
    .compare-con h4 {
      font-size: 43px;
      line-height: 48px;
      letter-spacing: 3.2px;
      margin-bottom: 7px;
    }
    .compare-con h2.title.green {
      line-height: 140px;
      font-size: 138px;
    }
    .compare-con.full-width {
      padding-top: 100px;
    }
    .col-2 {
      width: calc(50% - 16px);
      margin-right: 16px;
      min-height: 1345px;
      margin-bottom: 16px;
    }
    .compare-con .col-2 h4 {
      margin-bottom: 30px;
    }
    .compare-con .col-2 li {
      font-size: 32px;
      line-height: 54px;
      padding-bottom: 40px;
      padding-left: 46px;
      background-size: 35px;
      background-position: left 16px;
    }
    .footer-inner {
      max-width: 100%;
    }
    ul.social-icon {
      display: flex;
      justify-content: space-between;
      padding: 48px 15px;
    }
    ul.social-icon li i.fab {
      font-size: 38px;
    }
    .footer-con .logo-con.full-width {
      text-align: center;
    }
    .footer-inner .logo-con img {
      width: auto;
    }
    .logo-text {
      top: 55px;
    }
    .logo-text span li {
      font-size: 66px;
      line-height: 27px;
    }
    .logo-text li {
      font-size: 34px;
    }
    ul.f-menu {
      width: 100%;
      margin: 0 auto;
      max-width: 739px;
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
    }
    ul.f-menu li {
      padding: 0 75px 28px 75px;
      font-size: 35px;
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
    }
    .copy-con.full-width p,
    .bottom-para p {
      font-size: 30px;
      font-weight: 100;
    }
    .carousel-indicators {
      justify-content: center;
      padding-left: 0%;
    }
    .slider-con .carousel-indicators li {
      width: 112px;
      height: 13px;
    }
    .caption-right p.title.green {
      font-size: 59px;
      max-width: 718px;
    }
    .background-con {
      margin-top: 155px;
    }
    .background-con {
      margin-top: 35px;
      background: rgb(1, 45, 51);
      background: -moz-linear-gradient(
        0deg,
        rgba(1, 45, 51, 1) 0%,
        rgba(0, 0, 0, 1) 63%
      );
      background: -webkit-linear-gradient(
        0deg,
        rgba(1, 45, 51, 1) 0%,
        rgba(0, 0, 0, 1) 63%
      );
      background: linear-gradient(
        0deg,
        rgba(1, 45, 51, 1) 0%,
        rgba(0, 0, 0, 1) 63%
      );
      filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#012d33",endColorstr="#000000",GradientType=1);
    }
    .caption-right .counter {
      width: 100%;
      text-align: right;
    }
    .caption-right .counter span {
      font-size: 54px;
    }
    .water-con img,
    .energy-con img,
    .oil-con img,
    .gas-con img {
      width: 56px;
    }
    .counter font {
      font-size: 388px;
    }
    .counter {
      margin-top: 70px;
    }
    /*#menu {
      width: 741px;
      margin: -65px 0 0 -682px;
  }*/
    .property-left,
    .difference-left,
    .property-right,
    .difference-right {
      width: 100%;
    }
    .difference-left h2.title {
      margin-top: 120px;
      font-size: 138px;
      max-width: 850px;
    }
    .date-con.full-width {
      margin-top: 84px;
      padding: 0 20px 22px 20px;
      margin-bottom: 0px;
    }
    .tab-col {
      width: 100%;
    }
    .button-con .btn-btn.bottom-btn a {
      margin: 75px auto;
    }
    .button-con.full-width {
      width: calc(100% - 60px);
    }
    .property-right h3 {
      font-size: 74px;
      font-weight: bold;
      max-width: 870px;
    }
    .head-toggle.left {
      left: -183px;
    }
    .head-toggle.right {
      right: -199px;
    }
    .head-toggle {
      font-size: 20px;
    }
  }
  @media screen and (max-width: 980px) {
    .mobile-compare.row.d-block .col-6 {
      width: calc(50% - 8px);
      margin-right: 16px;
      min-height: 1075px;
      background: #2a2f30;
      margin-bottom: 16px;
      padding: 24px 35px 15px 35px;
      max-width: 100%;
    }
    .mobile-compare.row.d-block .col-6:last-child {
      margin-right: 0px;
    }
    .mobile-compare.row.d-block .col-6 ul {
      margin-top: 40px;
    }
    .mobile-compare.row.d-block .col-6 li {
      font-size: 28px;
      line-height: 38px;
      padding-bottom: 25px;
      padding-left: 48px;
      background-size: 33px;
      background-position: left 7px;
      color: #d0e9f2;
    }
    .col-6.third-col.float-right {
      border: 2px solid #289c82;
    }
    .mobile-compare .slick-next::before {
      background-image: url(../images/c-right-arrow.png);
      background-position: right center;
    }
    .mobile-compare .slick-prev::before {
      background-image: url(../images/c-left-arrow.png);
      background-position: left center;
    }
    .mobile-compare .slick-prev::before,
    .slick-next::before {
      background-repeat: no-repeat;
      padding: 3px 21px;
    }
  }
  
  @media screen and (max-width: 768px) {
    .color-text.point img,
    .color-text.water-text img,
    .color-text.colorYellow img,
    .color-text.gas img,
    .color-text.darkBlueColor img {
      width: 22px;
    }
    #menuToggle {
      left: -2px;
    }
    li.menu-item a {
      font-size: 60px;
      display: block;
    }
    li.menu-item a:hover {
      font-weight: 300;
    }
    .menu-item.menu-item-has-children:hover .sub-menu {
      position: static;
      background: none;
      width: 100%;
    }
    .menu-item {
      width: calc(100% - 100px);
      width: -webkit-calc(100% - 100px);
      padding: 8px 50px;
    }
  
    .menu-item.menu-item-has-children {
      background-position: 95% 40px;
      background-size: auto;
    }
    .menu-item.menu-item-has-children:hover {
      background-position: 95% 40px;
      background-size: auto;
    }
    .sub-menu li a {
      font-size: 30px;
    }
    .slider-con h1.h_title {
      max-width: 633px;
      font-size: 99px;
    }
    .carousel-caption {
      right: 0%;
      bottom: -288px;
      left: 0%;
      display: block !important;
    }
    h2 {
      font-size: 54px;
    }
    .carousel-inner .carousel-caption p.title {
      font-size: 50px;
      max-width: 100%;
    }
    .difference-inner .s-title {
      font-size: 88px;
    }
    .counter h2.title {
      font-size: 75px;
    }
    .counter span {
      font-size: 31px;
      line-height: 1;
    }
    .date-con .nav-tabs li {
      font-size: 17px;
    }
    .date-con .nav-tabs .nav-link.active span.top-border {
      width: 130px;
      height: 9px;
    }
    .dolors-con h3 font {
      font-size: 50px;
    }
    .pull-up,
    .pull-down {
      font-size: 22px;
    }
    .dolors-con h3,
    .water-con h3,
    .energy-con h3,
    .oil-con h3,
    .gas-con h3 {
      font-size: 40px;
    }
    .water-con h3 font {
      font-size: 56px;
    }
    .water-con img,
    .oil-con img,
    .gas-con img,
    .energy-con img {
      width: 30px;
    }
    .pull-down-left {
      bottom: -40px;
      font-size: 32px;
      right: 0px;
    }
    .energy-con .pull-down-left {
      right: 0px;
    }
    .oil-con .pull-down-left,
    .gas-con .pull-down-left {
      right: 0px;
    }
    .difference-con {
      padding: 62px 10px 40px 10px;
    }
    .pull-up {
      top: 0px;
    }
    .pull-down {
      bottom: 4px;
    }
    .property-con {
      padding: 32px 25px 0;
    }
    .full-width.para {
      width: 578px;
      margin-top: 24px;
    }
    .property-con .para h4 {
      font-size: 28px;
    }
    .btn-btn a {
      font-size: 36px;
      max-width: 550px;
    }
    .slider-con .carousel-indicators {
      bottom: -61px;
    }
    h2.title.green {
      font-size: 45px;
      max-width: 678px;
    }
    .property-con .para p {
      font-size: 33px;
      letter-spacing: 1px;
    }
    .button-left.col-6 h3 {
      font-size: 50px;
      max-width: 634px;
    }
    .user-con .col-3 img {
      width: 248px;
    }
    .user-con .col-6 h4,
    .user-con .col-6 p {
      padding-left: 21px;
    }
    .user-con .col-6 h4 {
      font-size: 37px;
      letter-spacing: 3px;
      margin: 24px 0px 0px;
    }
    .user-con .col-6 p {
      font-size: 28px;
      line-height: 37px;
      letter-spacing: 2px;
      text-align: left;
    }
    .property-con .bottom-row p {
      font-size: 33px;
      line-height: 40px;
      letter-spacing: 1.1px;
      max-width: 620px;
    }
    .live-data-con h2.title.green {
      font-size: 70px;
      line-height: 70px;
    }
    .live-data-con h3 {
      font-size: 46px;
    }
    .compare-con h2.title.green {
      line-height: 65px;
      font-size: 64px;
    }
    .mobile-compare.row.d-block .col-6 h4 {
      font-size: 32px;
      line-height: 38px;
      letter-spacing: 1.2px;
      margin-bottom: 01px;
    }
    .mobile-compare.row.d-block .col-6 {
      min-height: 870;
      padding-right: 35px;
      padding-left: 35px;
    }
    .compare-con .head-top.full-width {
      margin-bottom: 32px;
    }
    .mobile-compare.row.d-block .col-6 li {
      font-size: 22px;
      line-height: 29px;
      padding-bottom: 18px;
      padding-left: 43px;
      background-size: 25px;
      background-position: left 7px;
    }
    .footer-con.full-width {
      padding-top: 0px;
    }
    .logo-text span li {
      font-size: 30px;
    }
    .logo-text li {
      font-size: 16px;
    }
    .footer-inner .logo-con img {
      width: 100px;
    }
    .logo-text {
      top: 30px;
    }
    ul.social-icon {
      padding: 26px 15px;
    }
    ul.social-icon li i.fab {
      font-size: 24px;
    }
    .footer-menu.full-width {
      padding-top: 10px;
    }
    ul.f-menu li {
      padding: 0 55px 18px 55px;
      font-size: 22px;
    }
    .copy-con.full-width p,
    .bottom-para p {
      font-size: 22px;
    }
    caption-right p.title.green {
      font-size: 46px;
      max-width: 548px;
    }
    .counter {
      margin-top: 24px;
      text-align: center;
      float: none;
    }
    .counter font {
      font-size: 74px;
    }
    .counter font {
      font-size: 216px;
    }
    .background-con {
      margin-top: 5px;
    }
    .caption-left {
      padding-left: 19px;
    }
    .difference-left h2.title {
      margin-top: 10px;
      font-size: 88px;
      max-width: 620px;
    }
    .difference-left p.title.green {
      max-width: 537px;
      font-size: 45px;
    }
    .date-con h3 font {
      font-size: 56px;
      line-height: 0.9;
    }
    .oil-con,
    .gas-con {
      margin: 90px 0;
    }
    .water-con {
      margin-top: 8px;
    }
    .property-right h3 {
      font-size: 54px;
      max-width: 790px;
    }
    .button-con .btn-btn.bottom-btn a {
      margin-top: 34px;
      margin-bottom: 60px;
    }
    .live-data-con img {
      width: 1175px;
    }
  
    /** S E R V I C E   P A G E   S T A R T   **/
  
    .mobileViewOnly{
      display: block;
    }
    .desktopViewOnly{
      display: none;
    }
  
    .popup-content-sec {
      padding: 25px 10px !important;
    }
  
    .time_save.mobile-show {
      display: block;
      position: absolute;
      top: 60px;
      left: 12px;
      right: 22px;
    }
    .image-block img {
      width: 135px;
      margin: 30px 0 auto;
    }
    #menuToggle input:checked ~ span {
      transform: rotate(45deg) translate(5px, -9px);
    }
    #menuToggle input:checked ~ span:nth-last-child(2) {
      transform: rotate(-45deg) translate(7px, 8px);
    }
    #menuToggle {
      top: 12px;
      left: 27px;
    }
    .logo-left {
      padding-top: 10px;
    }
  
    .image_save {
      float: none;
      width: 100%;
    }
  
    .building-block-sec span.small-text {
      padding-top: 19px !important;
    }
    .text-mobile {
      padding-left: 12px;
    }
    .time_save.desktop-show {
      padding-left: 00px;
    }
    .overlay:target {
      overflow: scroll;
    }
    #carousel-main .carousel-inner {
      overflow: hidden;
    }
    .popup-csetio .popup .close {
      z-index: 999;
      box-shadow: 1px 6px 14px #126e69;
      position: sticky;
      top: 10px;
    }
    .popup-csetio .content .row {
      width: 100%;
      margin: 0 0 0 -10px;
    }
    .overlay:target {
      overflow-y: scroll;
    }
    .popup {
      width: 100%;
    }
    .popup-content-sec.color-design.box5_color,
    .popup-content-sec {
      margin-top: 30px;
    }
    .box.gradient-box.sytle-border1 {
      margin-bottom: 15px;
    }
    .box.gradient-box.box.gradient-box.sytle-border5 {
      margin-bottom: 15px;
    }
    .block_text p {
      color: #d0e9f2;
      font-size: 18px;
    }
    .col-md-12.fs-main {
      padding-left: 0;
    }
    .row.inner-popupss.popup3sec {
      margin-top: 17px;
    }
    div#carousel-main {
      padding-top: 29px;
    }
    #carousel-main p.title {
      text-align: left;
      padding-top: 49px;
      font-size: 15px;
      line-height: 28px;
    }
    .gradient-box a {
      padding: 20px 6px;
    }
    #carousel-main .carousel {
      padding-bottom: 96px;
    }
    .text-slide {
      width: 100%;
  
      padding: 0 0px 0 0px;
    }
    #carousel-main .carousel-indicators {
      bottom: 46px;
    }
    #carousel-main img.d-block.w-100 {
      width: 100% !important;
      margin: 0 auto;
      padding-top: 26px;
    }
    #carousel-main .carousel-indicators li {
      width: 25px;
      height: 5px;
    }
    div#carousel-main {
      margin-bottom: 59px;
    }
    .tanle-content p {
      padding-left: 0px;
    }
    .box {
      width: 100%;
    }
    .text-mobile p {
      display: block;
      padding-left: 0px;
      padding-top: 13px;
      font-size: 18px;
    }
    .time_save.desktop-show {
      display: none;
    }
    .image_save img {
      width: 100%;
    }
    .time_save.mobile-show p {
      padding-top: 156px;
    }
    .time_save h3 {
      font-size: 44px;
      padding-top: 10px;
      line-height: 48px;
    }
    section.building-block-sec {
      padding-left: 10px;
      padding-right: 10px;
      padding-top: 22px;
      padding-bottom: 0px;
    }
    section.building-block-sec .container {
      width: 92%;
    }
    .inner-popupss .col-md-4 {
      padding-right: 0;
      padding-left: 0;
    }
    .slider-text {
      padding-left: 46px;
    }
    span.live_poins {
      font-size: 9px;
    }
    span.live_ris {
      font-size: 9px;
    }
    span.samlltext {
      font-size: 8px;
    }
    .tanle-content p {
      font-size: 11px;
    }
    span.live_both {
      font-size: 9px;
    }
    .bottom-para.full-width {
      padding-bottom: 29px;
    }
    .table_sec_main .slider-text {
      padding-left: 32px;
      padding-bottom: 0;
    }
    section.table_sec_main {
      padding-left: 0px;
      padding-bottom: 20px;
      padding-right: 0px;
    }
  
    #carousel-main p.title br {
      display: none;
    }
    .slider-text h3 {
      font-size: 49px;
    }
    .col-md-12.top-popup-secn {
      padding-right: 0;
      padding-left: 0;
    }
    .gradient-box a {
      font-size: 12px;
    }
    .block_text p br {
      display: none;
    }
    .time_save.mobile-show span.small-text {
      padding-top: 0;
      padding-bottom: 9px;
      font-size: 16px;
    }
    .save-time-sec .col-md-12 {
      padding: 0;
    }
    .block_text h3 {
      font-size: 41px;
      padding-top: 11px;
      padding-bottom: 11px;
    }
    .image_save {
      position: relative;
      top: -22px;
    }
    .main-sec-water {
      padding-left: 0;
    }
    .cross-icon i.fas.fa-check {
      width: 20px;
      height: 20px;
      line-height: 20px;
    }
    span.cross-icontext {
      font-size: 6px;
    }
    .tanle-content img {
      width: 37px;
  
      margin-top: 12px;
    }
    .table_sec_main span.small-text {
      padding-top: 20px;
    }
  }
  @media screen and (max-width: 640px) {
    .difference-inner .s-title {
      font-size: 80px;
    }
    h2.title.green {
      font-size: 43px;
      max-width: 725px;
    }
    .water-con.full-width {
      padding-right: 0px;
    }
    .dolors-con h3,
    .water-con h3,
    .energy-con h3,
    .oil-con h3,
    .gas-con h3 {
      font-size: 35px;
    }
    .water-con h3 font {
      font-size: 50px;
    }
    .pull-up,
    .pull-down {
      font-size: 22px;
    }
    .pull-up {
      top: -17px;
    }
    .pull-down {
      bottom: -23px;
    }
    .energy-con .pull-down-left {
      right: 186px;
    }
    .pull-down-left {
      font-size: 28px;
    }
    .oil-con .pull-down-left,
    .gas-con .pull-down-left {
      right: 110px;
    }
    .property-con {
      padding-left: 5px;
      padding-right: 5px;
    }
    .property-con .difference-con {
      padding: 0px 0px 5px;
    }
    .property-left {
      padding-left: 0px;
      margin-top: 34px;
    }
    .slider-con h1.h_title {
      max-width: 586px;
      font-size: 90px;
    }
    .slider-con .carousel-indicators {
      bottom: -90px;
    }
    .caption-inner {
      top: 97px;
    }
    .slider-con h1.h_title {
      max-width: 546px;
      font-size: 85px;
    }
    .carousel-inner .carousel-caption p.title {
      font-size: 45px;
    }
    .carousel-caption {
      bottom: -229px;
    }
    .user-con .col-6 img {
      width: auto;
    }
    .mobile-compare.row.d-block.d-lg-none.d-xl-none {
      width: 100%;
      float: left;
      margin: 0px;
    }
    .mobile-compare.row.d-block .col-6 li {
      padding-left: 34px;
    }
    .mobile-compare.row.d-block .col-6 {
      width: calc(50% - 6px);
      margin-right: 12px;
      min-height: 1075px;
      padding: 24px 27px 15px 27px;
    }
    .head-toggle.left {
      left: -167px;
    }
    .head-toggle {
      font-size: 18px;
    }
    .head-toggle.right {
      right: -173px;
    }
  }
  @media screen and (max-width: 580px) {
    .slider-con h1.h_title {
      position: absolute;
      top: -6px;
      left: 18px;
      max-width: 520px;
      font-size: 80px;
      width: 100%;
    }
    .difference-inner .s-title,
    .s-title {
      font-size: 42px;
    }
    h2 {
      font-size: 26px;
    }
    h2.title {
      max-width: 690px;
    }
    .counter h2.title {
      font-size: 34px;
      margin-bottom: 0.1rem;
    }
    .counter span {
      font-size: 24px;
    }
    .counter span {
      letter-spacing: 11px;
    }
    .difference-con {
      padding-left: 0px;
      padding-right: 0px;
    }
    .date-con .row span:nth-child(n) {
      padding-left: 5px;
    }
    .date-con .nav-tabs li {
      font-size: 16px;
    }
    .dolors-con h3 font {
      font-size: 30px;
    }
    .pull-up,
    .pull-down {
      font-size: 18px;
    }
    .pull-up {
      top: -2px;
    }
    .pull-down {
      bottom: 2px;
    }
    .dolors-con h3,
    .water-con h3,
    .energy-con h3,
    .oil-con h3,
    .gas-con h3 {
      font-size: 34px;
    }
    #myTabContent {
      margin-top: 32px;
    }
    .difference-con {
      padding: 56px 0px 8px 0px;
    }
    .property-con h2.title.green {
      padding-top: 0px;
      font-size: 39px;
    }
    .property-con .para h4 {
      font-size: 20px;
      line-height: 1.1;
      max-width: 318px;
    }
    .full-width.para {
      margin-top: 16px;
    }
    .btn-btn a {
      font-size: 22px;
      max-width: 300px;
    }
    .water-con h3 font {
      font-size: 56px;
    }
    .pull-down-left {
      bottom: -34px;
      right: 0px;
      font-size: 28px;
    }
    .energy-con .pull-down-left {
      right: 0px;
    }
    .oil-con .pull-down-left,
    .gas-con .pull-down-left {
      right: 0px;
    }
    .water-con img,
    .oil-con img,
    .gas-con img,
    .energy-con img {
      width: 30px;
    }
    h2.title.green {
      font-size: 27px;
      max-width: 580px;
    }
    li.menu-item a {
      font-size: 28px;
    }
    .sub-menu li a {
      font-size: 20px;
    }
    .menu-item.menu-item-has-children {
      background-position-x: 84%;
      background-position-y: 21px;
    }
    .date-con .nav-tabs .nav-link.active span.top-border {
      width: 73px;
      height: 5px;
    }
    .slider-con .carousel-indicators {
      bottom: -49px;
    }
    .top-strip {
      padding: 4px 0 14px 0;
    }
    #menuToggle {
      top: 16px;
      left: 13px;
    }
    #menuToggle span {
      width: 34px;
    }
    #menuToggle input:checked ~ span {
      transform: rotate(45deg) translate(-5px, -8px);
    }
    #menuToggle input:checked ~ span:nth-last-child(2) {
      transform: rotate(-45deg) translate(7px, -2px);
    }
    .slider-con .carousel-indicators li {
      height: 8px;
      margin-right: 5px;
      margin-left: 5px;
      width: 65px;
    }
    .counter {
      margin-top: 30px;
    }
    .date-con.full-width {
      margin: 36px 0;
    }
    .water-con {
      margin: 52px 0;
    }
    .oil-con {
      margin: 74px 0;
    }
    .water-con.full-width {
      padding-right: 0px;
    }
    .oil-con.full-width,
    .gas-con.full-width {
      padding-right: 68px;
    }
    .slider-con .carousel-inner .d-none {
      display: block !important;
    }
    .slider-con .carousel-inner .d-none h2 {
      font-size: 24px;
    }
    .carousel-caption {
      bottom: 0px;
      left: 3%;
      top: 430px;
    }
    .property-con .para p {
      font-size: 25px;
      max-width: 450px;
    }
    .button-left.col-6 h3 {
      font-size: 35px;
      max-width: 484px;
    }
    .user-con .col-6 {
      padding: 10px 0px;
      text-align: center;
    }
    .user-con .col-6 h4,
    .user-con .col-6 p {
      padding-left: 30px;
    }
    .user-con .col-6 p {
      font-size: 22px;
      line-height: 30px;
      letter-spacing: 1px;
    }
    .user-con .col-6 h4 {
      font-size: 35px;
      letter-spacing: 1px;
    }
    .property-con .bottom-row p {
      font-size: 25px;
      line-height: 30px;
      letter-spacing: 1px;
      max-width: 494px;
      padding-left: 0px;
      margin-top: 20px;
    }
    .live-data-con.full-width {
      padding-top: 10px;
    }
    .head-top.full-width {
      padding-left: 3%;
      margin-bottom: 10px;
    }
    .live-data-con h2.title.green {
      font-size: 42px;
      line-height: 35px;
    }
    .live-data-con h3 {
      font-size: 22px;
    }
    .live-data-con h3 {
      margin-top: 8px;
    }
    .compare-con h4 {
      font-size: 20px;
      line-height: 24px;
      letter-spacing: 1px;
      padding: 0px;
    }
    .compare-con h2.title.green {
      line-height: 43px;
      font-size: 40px;
      padding: 0px;
    }
    .col-2 {
      min-height: 452px;
      padding: 10px;
    }
    .compare-con .col-2 li {
      font-size: 16px;
      line-height: 25px;
      padding-bottom: 10px;
      padding-left: 26px;
      background-size: 20px;
      background-position: left 8px;
    }
    .compare-con.full-width {
      padding: 34px 0 10px;
    }
    ul.social-icon li i.fab {
      font-size: 18px;
    }
    .footer-inner .logo-con img {
      width: 88px;
    }
    .logo-text span li {
      font-size: 24px;
      line-height: 12px;
    }
    .logo-text li {
      font-size: 14px;
    }
    ul.f-menu li {
      padding: 0 32px 14px 32px;
      font-size: 18px;
    }
    ul.social-icon {
      padding: 18px 6px;
    }
    .copy-con.full-width p,
    .bottom-para p {
      font-size: 18px;
      margin-bottom: 0px;
    }
  
    .carousel-inner .carousel-caption p.title {
      font-size: 38px;
    }
    .caption-right {
      padding-left: 24px;
    }
    .caption-right p.title.green {
      font-size: 40px;
    }
    .counter font {
      font-size: 164px;
    }
    .menu-item.menu-item-has-children:hover {
      background-position: 84% 21px;
    }
    .menu-item {
      width: 100%;
    }
    li.menu-item .sub-menu li a {
      font-size: 22px;
    }
    .property-left {
      margin-top: 0px;
    }
    .property-right h3 {
      font-size: 38px;
      max-width: 460px;
    }
    .live-data-con img {
      width: 995px;
    }
    .caption-inner {
      top: 57px;
    }
    .button-con.full-width {
      width: 100%;
    }
    .user-con .col-6 {
      margin: 20px 0 0px 0;
    }
    .mobile-compare.row.d-block .col-6 h4 {
      font-size: 25px;
      line-height: 32px;
    }
    .mobile-compare.row.d-block .col-6 li {
      font-size: 18px;
      line-height: 28px;
      padding-left: 32px;
      background-size: 24px;
    }
    .mobile-compare.row.d-block .col-6 {
      min-height: 1258px;
      padding: 24px 27px 15px 27px;
    }
  }
  @media screen and (max-width: 480px) {
    .slider-con h1.h_title {
      position: absolute;
      top: -33px;
      left: 18px;
      max-width: 378px;
      font-size: 58px;
    }
    .property-con h2.title.green {
      font-size: 32px;
      max-width: 470px;
    }
    .property-con .para p {
      font-size: 20px;
      max-width: 370px;
    }
    .button-right.col-6 {
      margin-bottom: 33px;
    }
    .button-left.col-6 h3 {
      font-size: 28px;
      max-width: 391px;
    }
    .user-con .col-6 h4 {
      font-size: 28px;
      margin-top: 6px;
    }
    .user-con .col-6 p {
      font-size: 18px;
      line-height: 26px;
    }
    .property-con .bottom-row p {
      font-size: 20px;
      line-height: 1.3;
    }
    .live-data-con h2.title.green {
      font-size: 36px;
      line-height: 38px;
    }
    .live-data-con h3 {
      font-size: 20px;
    }
    .live-data-con img {
      margin-top: 6px;
    }
    .compare-con.full-width {
      padding: 24px 0 10px;
    }
    .col-2 {
      width: 100%;
      margin-right: 0px;
      min-height: auto;
    }
    .logo-text {
      top: 20px;
    }
    .carousel-inner .carousel-caption p.title {
      font-size: 31px;
    }
    .carousel-caption {
      left: 3%;
      top: 300px;
    }
    .caption-right p.title.green {
      font-size: 34px;
      max-width: 548px;
    }
    .counter font {
      font-size: 48px;
    }
    .caption-right .counter span {
      font-size: 26px;
    }
    .property-con {
      padding: 10px 0px 0;
    }
    .button-right.col-6 {
      margin-bottom: 38px;
      margin-top: 14px;
    }
    .compare-con .head-top.full-width {
      padding-left: 0%;
    }
    .caption-right h2.title {
      max-width: 357px;
      font-size: 52px;
    }
    .slider-con .carousel-indicators {
      bottom: -52px;
    }
    .caption-right {
      padding-left: 0px;
    }
    .date-con .nav-tabs li {
      flex-wrap: wrap;
      display: flex;
      margin: 11px auto;
    }
    .date-con .row {
      flex-wrap: wrap;
      column-count: 2;
      column-gap: 56px;
    }
    .live-data-con.full-width {
      margin-top: 8px;
    }
    .difference-left h2.title {
      font-size: 68px;
      max-width: 450px;
    }
    .difference-left p.title.green {
      max-width: 470px;
      font-size: 36px;
    }
    .counter font {
      font-size: 138px;
    }
    .counter span {
      letter-spacing: 8px;
    }
    .date-con.full-width {
      padding: 0px;
    }
    .water-con h3 font {
      font-size: 48px;
    }
    .dolors-con h3,
    .water-con h3,
    .energy-con h3,
    .oil-con h3,
    .gas-con h3 {
      font-size: 30px;
    }
    .pull-up,
    .pull-down {
      font-size: 16px;
    }
    .date-con h3 font {
      font-size: 48px;
    }
    .oil-con {
      margin: 70px 0;
    }
    .gas-con {
      margin-top: 70px;
    }
    .property-con {
      margin-top: 0px;
    }
    .property-right h3 {
      font-size: 32px;
      max-width: 408px;
    }
    .live-data-con img {
      width: 844px;
    }
    .footer-con.full-width {
      margin-top: 30px;
    }
    .user-con .col-6 {
      height: auto;
      margin: 40px 0 0px 0;
    }
    .property-right.col-6 {
      padding: 0px;
    }
    .user-con .col-6 img {
      width: 174px;
      margin-top: 2px;
    }
    .mobile-compare.row.d-block .col-6 ul {
      margin-top: 23px;
    }
    .mobile-compare.row.d-block .col-6 h4 {
      font-size: 22px;
    }
    .mobile-compare.row.d-block .col-6 li {
      font-size: 18px;
      padding-left: 24px;
      background-size: 22px;
    }
    .mobile-compare.row.d-block .col-6 {
      min-height: 1240px;
      padding: 24px 27px 15px 26px;
    }
    .mobile-compare .slick-prev::before,
    .slick-next::before {
      background-size: 28px;
    }
  }
  @media screen and (max-width: 420px) {
    .slider-con h1.h_title {
      position: absolute;
      top: -33px;
      left: 7px;
      max-width: 378px;
      font-size: 48px;
    }
    .carousel-inner .carousel-caption p.title {
      font-size: 26px;
    }
    .carousel-caption {
      left: 2%;
      top: 229px;
    }
    .slider-con .carousel-indicators li {
      width: 52px;
    }
    .slider-con .carousel-indicators {
      bottom: 347px;
    }
    .caption-right h2.title {
      max-width: 301px;
      font-size: 45px;
    }
    .caption-right p.title.green {
      font-size: 27px;
    }
    .slider-con .carousel-indicators {
      bottom: 281px;
    }
    .property-con .para p {
      max-width: 335px;
    }
    .difference-left h2.title {
      font-size: 50px;
      max-width: 360px;
    }
    .slider-con .carousel-indicators {
      bottom: -54px;
    }
    .difference-left p.title.green {
      max-width: 360px;
      font-size: 25px;
    }
    .caption-inner {
      top: 87px;
      right: -13px;
    }
    .water-con {
      margin-top: 25px;
    }
    .energy-con {
      margin-bottom: 70px;
    }
    .property-con h2.title.green {
      font-size: 28px;
      max-width: 370px;
    }
    .property-right h3 {
      font-size: 27px;
      max-width: 370px;
    }
    .button-con .btn-btn.bottom-btn a {
      margin-top: 25px;
      margin-bottom: 50px;
    }
    .live-data-con img {
      width: 794px;
    }
    .background-con {
      padding-bottom: 66px;
    }
    .copy-con.full-width {
      margin-top: 40px;
    }
    .user-con .col-6 img {
      width: 120px;
      margin-top: 30px;
    }
    .user-con .col-6 h4,
    .user-con .col-6 p {
      padding-left: 16px;
    }
    .user-con .col-6 {
      padding: 0px 0px;
      margin-top: 35px;
    }
    .bottom-row {
      float: left;
      margin-top: 8px;
    }
    .mobile-compare.row.d-block .col-6:last-child {
      margin-right: 0px;
      margin-top: 0px;
    }
    .mobile-compare.row.d-block .col-6 {
      width: calc(50% - 6px);
      margin: 0px 4px;
      min-height: 1186px;
      padding-right: 1px;
      padding-left: 0px;
    }
    .mobile-compare.row.d-block .col-6 h4 {
      font-size: 22px;
      padding-left: 6px;
    }
    .head-toggle.left {
      left: -151px;
      top: -4px;
    }
    .head-toggle.right {
      right: -155px;
      top: -4px;
    }
    .toggle-con .switch {
      width: 48px;
      height: 20px;
    }
    .toggle-con .slider::before {
      height: 24px;
      width: 24px;
      left: -2px;
      bottom: -2px;
    }
    .toggle-con input:checked ~ .slider::before {
      -webkit-transform: translateX(28px);
      -ms-transform: translateX(28px);
      transform: translateX(28px);
    }
  }
  