* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Avenir', sans-serif;
  }
  
  body {
      font-size: 16px;
  }
  
  .img-responsive {
      width: 100%;
      height: auto;
  }
  
  
  #navbar {
      font-size: 16px;
      padding-top: 40px;
      padding-bottom: 0px;
      color: #000000;
      font-weight: 400;
      position: relative;
  }
  
  #navbar .nav-item {
      padding: 7px 10px;
      transition: .3s all;
  }
  
  /* #navbar .nav-item:hover {
      color: #fff;
  } */
  
  #navbar .nav-link {
      transition: .3s all;
      color: #000000;
  }
  
  #navbar .nav-link:hover {
      transition: .3s all;
      color:#006BFF;
  }
  
  #req-dm1 {
      background-color: transparent;
      border: 2px solid #FFF;
      border-radius: 19px;
      outline: none;
      color: #FFF;
      padding: 4px 20px;
      margin-top: -10px;
  }
  
  #req-dm1:hover {
      background-color: transparent;
      border: 2px solid #000;
      border-radius: 19px;
      color: #000;
  }
  
  #home-bag {
      background-image: url(./images/ban-h.png); 
      background-repeat: no-repeat; 
      background-position-x: right;
      height: 100vw;
  }
  
  .navbar-nav {
      position: absolute;
      left: 32.1%;
  }
  
  .r-dp {
      position: absolute;
      right: -300px;
  }
  
  .main-banner {
      margin-top: 115px;
  }
  
  #main-bhead {
      font-size: 48px;
      font-weight: 900;
      color:  #006BFF; 
      margin-top: 15px;
      margin-bottom: 20px;
  }
  
  .main-banner p {
      font-size: 16px;
      margin-bottom: 40px;
  }
  
  #learnm {
      font-size: 16px;
      font-weight: 800;
  }
  
  #reqdem {
      background-color: #006BFF;
      color: #FFF;
      border: none;
      outline: none;
      border-radius: 19px;
      font-size: 16px;
      padding: 5px 20px;
      margin-left: 20px;
  }
  
  #reqdem:hover {
      background-color: #000000;
  }
  
  .brands-logo {
      margin-top: 200px;
      margin-bottom: 50px;
  }
  
  .add-marg {
      margin-bottom: 100px;
  }
  
  .add-marga{
      margin-bottom: 70px;
  }
  
  #bl-head {
      font-size: 20px;
      font-weight: 900;
      margin-bottom: 43px;
      margin-left: 100px;
  }
  
  #brands-slider {
      display: flex;
      gap: 70px;
      align-items: center;
      justify-content: center;
      margin-bottom: 134px;
  }
  
  .move{
      color: black;
  }
  .review {
    width: 100%;
    height: 100%;
    border: 1px solid transparent;
    display: flex;
    flex-wrap: wrap;
    align-content: center;
  }
  
  .review_margin{
      margin: 15px;
  }
  
  .b-desktop {
      display: none;
  }
  
  .reqq {
      padding-left: 10px;
      padding-right: 50px;
      cursor: pointer;
  }
  
  .reqq #reqhh {
      font-size: 20px;
      font-weight: 800;
      color: #006BFF;
      margin-top: 20px;
      margin-bottom: 14px;
  }
  
  .rep1 {
      background-image: url(./images/re1.png);
      background-repeat: no-repeat; 
      /* height: 100vw; */
      padding-top: 100px;
      padding-bottom: 270px;
  }
  
  #req3h {
      margin-top: 120px;
      font-size: 20px;
      font-weight: 400;
  }
  
  #req3sub {
      color: #FFF;
      font-size: 36px;
      font-weight: 800;
      margin-bottom: 30px;
      margin-top: 10px;
      line-height: 35px;
  }
  
  .rep3 p {
      color: #FFF;
      margin-bottom: 20px;
  }
  
  .rep3 a {
      color: #FFF;
      text-decoration: none;
      font-weight: 800;
  }
  
  .rep3 a:hover {
      color: #000000;
  }
  
  .rep3 a i {
      margin-left: 20px;
  }
  
  .rep2 {
      background-image: url(./images/re2.png);
      background-repeat: no-repeat; 
      background-position-x: right;
      padding-top: 100px;
      padding-bottom: 100px;
      position: relative;
      top: -150px;
  }
  
  
  #req2h {
      margin-top: 120px;
      font-size: 20px;
      font-weight: 400;
  }
  
  #req2sub {
      color: #FFF;
      font-size: 36px;
      font-weight: 800;
      margin-bottom: 30px;
      margin-top: 10px;
      line-height: 35px;
      
  }
  
  .rep2 p {
      color: #FFF;
      margin-bottom: 20px;
  }
  
  .rep2 a {
      color: #FFF;
      text-decoration: none;
      font-weight: 800;
  }
  
  .rep2 a:hover {
      color: #000000;
  }
  
  .rep2 a i {
      margin-left: 20px;
  }
  
  .rep5 {
      margin-top: 90px;
  }
  
  .secr {
      position: relative;
      top: -150px;
  }
  
  .secr1 {
      position: relative;
      top: -300px;
  }
  
  .secr2 {
      position: relative;
      top: -400px;
  }
  
  .secr0 {
      position: relative;
      top: -300px;
  }
  
  .home-footer {
      background-color: #000;
      color: #FFF;
      padding-top: 70px;
      text-align: center;
      position: relative;
      top: -230px;
  }
  
  .main-footer {
      background-color: #000;
      color: #FFF;
      padding-top: 70px;
      text-align: center;
  }
  
  #powered {
      font-size: 14px;
      margin-left: 80px;
      margin-bottom: 55px;
  }
  
  #powered a {
      color: #006BFF;
      text-decoration: none;
  }
  
  #footer-links a {
      text-decoration: none;
      color: #FFF;
      font-size: 14px;
  }
  
  #footer-links {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 40px;
      margin-bottom: 30px;
  }
  
  .home-footer p {
      margin-bottom: 34px;
  }
  
  .main-footer p {
      margin-bottom: 34px;
  }
  
  #footer-buttoma {
      background-color: #006BFF;
      height: 32px;
      width: 599px;
      border-radius: 0px 62.5856px 0px 0px;
  }
  
  #footer-buttomc {
      background-color: #006BFF;
      height: 32px;
      width: 599px;
      border-radius: 62.5856px 0px 0px 0px;
  }
  
  #footer-buttom {
      display: flex;
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
  }
  
  #footer-buttomb {
      display: flex;
      gap: 15px;
  }
  
  #other-bg {
      background-image: url(./images/otherbg.png);
      background-repeat: no-repeat;
      background-size: cover;
      height: 100vh;
  }
  
  #req-dm2 {
      background-color: #006BFF;
      border: none;
      border-radius: 19px;
      outline: none;
      color: #FFF;
      padding: 4px 20px;
      margin-top: -10px;
  }
  
  #req-dm2:hover {
      background-color: #000000;
  }
  
  .pricing {
      margin-top: 87px;
      text-align: center;
  }
  
  #p-banh {
      font-size: 48px;
      font-weight: 900;
      margin-bottom: 20px;
  }
  
  #p-bans {
      font-size: 16px;
      margin-bottom: 127px;
  }
  
  
  #plac-carda {
      background-color: #FFF;
      padding-top: 45px;
      padding-left: 50px;
      padding-right: 30px;
      width: 360px;
      border-radius: 50px;
      padding-bottom: 16px;
      box-shadow: rgba(50, 50, 105, 0.15) 0px 2px 5px 0px, rgba(0, 0, 0, 0.05) 0px 1px 1px 0px;
      height: 850px;
      margin-top: 50px;
      cursor: pointer;
  }
  
  #plac-carda:hover {
      background-color: #ECEBFF;
      /* color: #FFF; */
  }
  
  #plac-cardb:hover {
      background-color: #ECEBFF;
      color: #000;
  }
  
  #plac-cardb {
      background-color: #006BFF;
      padding-top: 45px;
      padding-left: 50px;
      padding-right: 30px;
      padding-bottom: 16px;
      width: 360px;
      border-radius: 50px;
      color: #FFF;
      box-shadow: rgba(50, 50, 105, 0.15) 0px 2px 5px 0px, rgba(0, 0, 0, 0.05) 0px 1px 1px 0px;
      height: 850px;
      cursor: pointer;
  }
  
  #plan-cards {
      display: flex;
      justify-content: space-between;
      gap: 30px;
      margin-bottom: 190px;
  }
  
  #pcardr {
      display: flex;
      align-items: center;
      gap: 15px;
      margin-bottom: 15px;
  }
  
  #pcardhc {
      font-size: 24px;
      font-weight: 900;
  }
  
  #plac-carda p {
      margin-bottom: 26px;
  }
  
  #plac-cardb p {
      margin-bottom: 26px;
  }
  
  #pcardhp {
      font-size: 48px;
      font-weight: 900;
  }
  
  #pcardhp span {
      font-size: 16px;
      font-weight: 400;
      margin-bottom: 17px;
  }
  
  #pcardhps {
      font-size: 16px;
      font-weight: 900;
      margin-bottom: 23px;
  }
  
  #plac-carda ul li {
      list-style: none;
      line-height: 35px;
  }
  
  #plac-cardb ul li {
      list-style: none;
      line-height: 35px;
  }
  
  #l-end {
      margin-bottom: 83px;
  }
  
  #pricing-btna {
      background-color: #006BFF;
      width: 100%;
      border: none;
      outline: none;
      border-radius: 96px;
      font-size: 18px;
      font-weight: 700;
      color: #FFF;
      padding: 15px;
  }
  
  #pricing-btna:hover {
      background-color: #000000;
  }
  
  #pricing-btnb {
      background-color: #FFF;
      width: 100%;
      border: none;
      outline: none;
      border-radius: 96px;
      font-size: 18px;
      font-weight: 700;
      color: #006BFF;
      padding: 15px;
  }
  
  #pricing-btnb:hover {
      background-color: #000000;
      color: #FFF;
  }
  
  .demoarea {
      margin-top: 87px;
      margin-bottom: 90px;
  }
  
  #reqdemoh {
      font-size: 48px;
      font-weight: 900;
      margin-bottom: 20px;
  }
  
  .req-form input, .form-select, textarea {
      width: 100%;
      margin-bottom: 20px;
      border: none;
      border-radius: 5px;
      box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
      padding: 10px;
      /* color: #C7C7C7; */
      caret-color: #006BFF;
      outline: none;
      background-color: #FFF;
  }
  
  .req-form input::placeholder {
      color: #C7C7C7;
  }
  
  .req-form .form-select  {
      color: #C7C7C7; 
  }
  
  .req-form p {
      margin-bottom: 5px;
  }
  
  .req-form p span {
      color: #FF0000;
  }
  
  #demos {
      background-color: #006BFF;
      color: #FFF;
      border: none;
      outline: none;
      width: 100%;
      border-radius: 19px;
      padding: 10px;
      margin-bottom: 149px;
      margin-top: 62px;
  }
  
  .contact-area {
      margin-top: 87px;
      background-image: url(./images/contban.png);
      background-repeat: no-repeat;
      background-position-x: right;
      padding-top: 70px;
      padding-right: 30px;
      margin-bottom: 95px;
  }
  
  #contactrh {
      font-size: 54px;
      font-weight: 900;
  }
  
  #contactrh span {
      color: #006BFF;
  }
  
  .contact-area input {
      width: 100%;
      border: 1px solid #E0E0E0;
      border-radius: 10px;
      outline: none;
      padding: 10px;
      margin-bottom: 20px;
  }
  
  .contact-area input::placeholder {
      color: #C7C7C7;
  }
  
  .contact-area .form-select {
      color: #C7C7C7; 
  }
  
  #contbtn {
      background-color: #006BFF;
      color: #FFF;
      border: none;
      outline: none;
      width: 100%;
      border-radius: 19px;
      padding: 10px;
      margin-top: 20px;
  }
  
  .contact-row p {
      margin-bottom: 50px;
  }
  
  .add-details {
      display: flex;
      justify-content: space-evenly;
      margin-bottom: 100px;
  }
  
  #addd1 {
      display: flex;
      align-items: center;
      gap: 20px;
  }
  
  #addd2 {
      display: flex;
      align-items: center;
      gap: 20px;
  }
  
  #addd1 p {
      margin-top: 20px;
  }
  
  #addd2 p {
      margin-top: 75px;
  }
  
  .innerbanner {
      margin-top: 41px;
      background-image: url(./images/inn1.png);
      background-repeat: no-repeat;
      background-size: cover;
      padding-top: 92px;
      padding-bottom: 200px;
      color: #FFF;
  }
  
  #innerrh {
      font-weight: 900px;
      font-size: 36px;
      margin-top: 100px;
      margin-bottom: 20px;
  }
  
  .innbm img {
      margin-top: 40px;
  }
  
  .innerbsub {
      text-align: center;
      margin-bottom: 90px;
  }
  
  #get-started {
      display: flex;
      align-items: center;
      justify-content: center;
      margin-top: 103px;
      margin-bottom: 142px;
  }
  
  #btn-get {
      background-color: #006BFF;
      color: #FFF;
      border: none;
      outline: none;
      border-radius: 19px;
      padding: 10px 35px;
  }
  
  #btn-get:hover {
      background-color: #000000;
  }
  
  .company {
      margin-top: 87px;
      margin-bottom: 131px;
  }
  
  #comph {
      font-size: 36px;
      font-weight: 900;
      margin-top: 100px;
      margin-bottom: 10px;
  }
  
  #cp-rowh {
      font-size: 40px;
      font-weight: 900;
      margin-bottom: 60px;
  }
  
  #cp-rowh span {
      color: #006BFF;
  }
  
  .cp-roww a {
      text-decoration: none;
      color: #006BFF;
      
  }
  
  #cp-rowww {
      margin-top: 50px;
      margin-bottom: 133px;
  }
  
  .cp-rowwa {
      margin-right: 70px;
      margin-top: 80px;
  }
  
  .resourcesa {
      margin-top: 50px;
      margin-bottom: 86px;
  }
  
  #resource-h {
      font-size: 48px;
      font-weight: 900;
      margin-top: 40px;
      margin-bottom: 20px;
  }
  
  #ress-roh {
      font-weight: 900;
      margin-top: 20px;
      margin-bottom: 10px;
  }
  
  #ressrows {
      display: flex;
      justify-content: space-between;
  }
  
  #rsesss {
      font-size: 12px;
      font-weight: 900;
  }
  
  #ressrowsa {
      display: flex;
      align-items: center;
      gap: 10px;
  }
  
  #btn-res {
      background-color: #006BFF;
      border: none;
      outline: none;
      color: #FFF;
      border-radius: 19px;
      padding: 5px 30px;
  }
  
  #btn-res:hover {
      background-color: #000000;
  }
  
  .ress-roww {
      margin-bottom: 60px;
      cursor: pointer;
  }
  
  /* blur hover effect */
  /* .ress-row img {
      -webkit-filter: blur(3px);
      filter: blur(3px);
      -webkit-transition: .3s ease-in-out;
      transition: .3s ease-in-out;
  }
  
  .ress-row img:hover {
      -webkit-filter: blur(0);
      filter: blur(0);
  } */
  
  
  .ress-row img {
      -webkit-filter: grayscale(100%);
      filter: grayscale(100%);
      -webkit-transition: .3s ease-in-out;
      transition: .3s ease-in-out;
  }
  
  .ress-row img:hover {
      -webkit-filter: grayscale(0);
      filter: grayscale(0);
  }
  
  #ressrowsa i {
      color: #006BFF;
  }
  
  #load-m {
      text-align: center;
      font-size: 20px;
      margin-bottom: 141px;
  }
  
  #load-m a {
      text-decoration: none;
      color: #000;
  }
  
  #load-m i {
      color: #006BFF;
  }
  
  
  /* text */
  
  
  .dropdown {
      position: relative;
  }
  
  .dropdown-menu {
      position: absolute;
      top: 100%;
      left: 0;
      /* background: #ECEBFF; */
      color: #006BFF;
      list-style: none;
      padding: 0;
      margin: 0;
      display: none;
      opacity: 0;
      transition: opacity 250ms ease-in-out;
      animation: scaleZ 300ms  ease-in-out forwards;
  }
  
  @keyframes scaleZ {
      0% {
        opacity: 0;
        transform: scale(0);
      }
      
      80% {
        transform: scale(1.07);
      }
    
      100% {
        opacity: 1;
        transform: scale(1);
      }
  }
  
  .dropdown:hover .dropdown-menu {
      display: block;
      opacity: 1;
      color: #006BFF;
      /* transition-delay: 0.1s; */
  }
  
  .dropdown li a {
      display: block;
      padding: 15px;
      color: #006BFF;
      text-decoration: none;
  }
  
  
  .dropdown-item:hover {
      background-color: #006BFF;
      color: #FFF;
  }
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  
  /* MEDIA QUERRY */
  
  @media (max-width: 736px) {
  
      .ress-row {
          margin-bottom: 60px;
      }
  
      .ress-row img {
          width: 100%;
      }
  
      .rrrh {
          margin-bottom: 30px;
      }
  
      .cp-rowwa {
          margin-bottom: 50px;
          margin-top: -50px;
      }
      
      .navbar-nav {
          position:relative;
          left: 0%;
      }
  
      .r-dp {
          position: relative;
          right: 0px;
      }
  
      #home-bag {
          background-image: none;
          /* background-image: url(./images/ban-h.png); 
          background-repeat: no-repeat;  */
          /* background-position: center; */
          /* background-position-x: right; */
          /* height: 100vw; */
      }
  
      #req-dm1 {
          background-color: transparent;
          border: 2px solid #000;
          border-radius: 19px;
          color: #000;
      }
  
  
      #navbar {
          position: relative;
      }
  
      #learnm {
          margin-bottom: 30px;
      }
  
      .main-banner {
          margin-top: 40px;
      }
  
      #main-bhead {
          font-size: 28px;
      }
  
      .brands-logo {
          margin-top: 50px;
      }
  
      #brands-sliderm {
          display: flex;
          gap: 70px;
          align-items: center;
          padding-right: 20px;
          padding-left: 20px;
          margin-bottom: 20px;
      }
  
      #bl-headm {
          font-size: 18px;
          font-weight: 900;
          margin-bottom: 43px;
      }
  
      .b-desktop {
          display: block;
      }
  
      .b-mobile {
          display: none;
      }
  
      .rep1 {
          background-image: url(./images/re1.png);
          background-repeat: no-repeat; 
          background-size: cover;
          padding-top: 250px;
          padding-bottom: 10px;
      }
  
      .rep2 {
          background-image: url(./images/re2.png);
          background-repeat: no-repeat; 
          background-position-y: bottom;
          /* background-size: cover; */
          padding-top: 250px;
          padding-bottom: 120px;
          position: relative;
          top: -300px;
      }
  
      #req3h {
          margin-top: 120px;
          font-size: 16px;
          font-weight: 400;
      }
      
      #req3sub {
          color: #FFF;
          font-size: 26px;
          font-weight: 800;
          margin-bottom: 20px;
      }
  
      #req2h {
          margin-top: 50px;
          font-size: 16px;
          font-weight: 400;
      }
      
      #req2sub {
          color: #FFF;
          font-size: 26px;
          font-weight: 800;
          margin-bottom: 20px;
      }
  
      .rep3 p {
          color: #000;
      }
      
      .rep3 a {
          color: #000;
      }
  
      .rep2 p {
          color: #000;
      }
      
      .rep2 a {
          color: #000;
      }
  
      .rep4 {
          margin-top: 30px;
      }
  
      .rep1 {
          margin-bottom: 40px;
      }
  
      .secr {
          position: relative;
          top: -500px;
      }
  
      .secr1 {
          position: relative;
          top: -800px;
      }
  
      .secr0 {
          position: relative;
          top: -1000px;
      }
  
      .secr2 {
          position: relative;
          top: -1300px;
      }
  
      .home-footer {
          position: relative;
          top: -1200px;
      }
  
      #footer-links {
          display: flex;
          align-items: center;
          justify-content: center;
          gap: 20px;
      }
  
      #footer-buttomb {
          display: flex;
          gap: 10px;
      }
  
      #plan-cards {
          display: flex;
          flex-direction: column;
          /* gap: 20px; */
      }
  
      #plac-carda {
          width: 100%;
          height: 850px;
      }
      
      #plac-cardb {
          width: 100%;
          height: 920px;
          margin-bottom: -50px;
      }
  
      .contact-area {
          background-image: none;
      }
  
      #c-map iframe {
          width: 100%;
      }
  
      #c-map {
          margin-top: 20px;
      }
  
      .add-details {
          display: flex;
          flex-direction: column;
      }
  
      #addd2 p {
          margin-top: 20px;
      }
  
      .innerbanner {
          padding-top: 10px;
          padding-bottom: 350px;
          color: #FFF;
      }
  
      #innerrh {
          font-weight: 900px;
          font-size: 36px;
          margin-top: 30px;
          margin-bottom: 20px;
      }
  
      .innerbsub {
          margin-top: -70px;
      }
  
      
  }
  
  
  
  
  
  
  
  @media only screen 
  and (min-device-width : 768px) 
  and (max-device-width : 1024px)
  and (-webkit-min-device-pixel-ratio: 2) { /* STYLES GO HERE */
  
  
      
  
  }
  
  
  
  @media (min-device-width : 737px)
  and	(max-device-width : 991px){
      
       
      
      
  }
  
  
  @media only screen 
  and (min-device-width : 737px) 
  and (max-device-width : 767px) { /* STYLES GO HERE */
  
  
  
  }
  
  /* 
    ##Device = Low Resolution Tablets, Mobiles (Landscape)
    ##Screen = B/w 481px to 767px
  */
  
  @media (min-width: 481px) and (max-width: 767px) {
    
      
      
      
    
  }
  
  
  
  
  @media (min-width:320px) and (max-width: 480px) { 
      
      
      
  }