/*******************************
 Responsive CSS
*******************************/
/* Extra XS Small devices (portrait phones 200px : 442px ) */
@media (min-width: 200px) and (max-width: 441.98px) {
  .navbar-collapse{
    background: linear-gradient(167deg, #1c4450 7.81%, #1c4450 17.18%, #163b3b 32.32%, #123a31 53.13%, #143a36 73.43%, #183e42 88.61%);
    padding: 10px 20px 20px;
  }
  .navbar.scrolled .navbar-collapse{
    background: none;
    padding-bottom: 10px;
  }
  .navbar,.navbar.scrolled {
    padding: 5px 20px;
  }
  .container, .container-fluid, .container-xxl, .container-xl, .container-lg, .container-md, .container-sm {
    padding-left: 30px;
    padding-right: 30px;
  }
  .container, .container-sm {
    max-width: none;
  }
  .padd-100 {
    padding: 50px 0;
  }
  .padd-80 {
    padding: 40px 0;
  }
  .padd-60 {
    padding: 40px 0;
  }
  .sec-title{
    margin-bottom: 30px !important;
  }
  .hero-content {
    position: relative;
    z-index: 10;
    padding: 90px 0 20px 0;
  }
  .main-section__title {
    width: 100%;
    font-size: 20px;
  }
  .stat-label {
      font-size: 14px;
      line-height: 10px;
  }
  .stat-value {
    font-size: 15px;
  }
  .hero-description{
    font-size: 15px;
    line-height: 23px;
  }
  .feature-item {
      font-size: 14px;
  }
  .hero-title {
    font-size: 32px;
    line-height: 42px;
  }
  .hero-features {
    row-gap: 6px;
    margin-bottom: 20px;
  }
  .hero-img img{
    width: 100%;
    height: auto;
    left: -60px;
    position: relative;
  }
  .section-description {
      font-size: 14px;
      line-height: 22px;
  }
  .section-title {
      font-size: 20px;
      margin: 3px 0 3px 0;
  }
  .section-tag {
    margin-bottom: 0px;
  }
  .div-cards-list {
    --cols: 1;
    margin-bottom: 0;
  }
  .div-cards__icon::before, .div-cards__icon::after{
    display: none;
  }
  .div-cards__item {
    padding-top: 100px;
    padding-right: 20px;
  }
  .right-icon .div-cards__icon,
  .left-icon .div-cards__icon  {
    right: 10%;
    top: -70px;
    left: auto;
  }
  .right-icon.div-cards__item {
    padding-right: 35px;
    margin-bottom: 70px;
  }
  .left-icon.div-cards__item{
    padding-left: 35px;
  }
  .div-cards-list {
    padding: 30px 40px 40px 30px;
  }
  .target-cards{
    gap: 20px;
  }
  .target-card{
    flex: 1 0 100%;
  }
  .step-card:not(:first-child)::before {
    left: 91%;
    top: -20px;
    height: 35px;
    width: 2px;
    background: linear-gradient(60deg, #21a62500 0%, #21a62585 90%);
    z-index: 2;
  }
  .stat-2 {
    right: -90px;
  }
  .journey-steps {
    --cols: 1;
  }
}

/* XS Small devices (portrait phones 442px : 576px ) */
@media (min-width: 442px) and (max-width: 575.98px) {
  .navbar-collapse{
    background: linear-gradient(167deg, #1c4450 7.81%, #1c4450 17.18%, #163b3b 32.32%, #123a31 53.13%, #143a36 73.43%, #183e42 88.61%);
    padding: 10px 20px 20px;
  }
  .navbar.scrolled .navbar-collapse{
    background: none;
    padding-bottom: 10px;
  }
  .navbar,.navbar.scrolled {
    padding: 5px 20px;
  }
  .container, .container-fluid, .container-xxl, .container-xl, .container-lg, .container-md, .container-sm {
    padding-left: 30px;
    padding-right: 30px;
  }
  .container, .container-sm {
    max-width: none;
  }
  .padd-100 {
    padding: 50px 0;
  }
  .padd-80 {
    padding: 40px 0;
  }
  .padd-60 {
    padding: 40px 0;
  }
  .sec-title{
    margin-bottom: 30px !important;
  }
  .hero-content {
    position: relative;
    z-index: 10;
    padding: 90px 0 20px 0;
  }
  .main-section__title {
    width: 100%;
    font-size: 20px;
  }
  .stat-label {
      font-size: 14px;
      line-height: 10px;
  }
  .stat-value {
    font-size: 15px;
  }
  .hero-description{
    font-size: 15px;
    line-height: 23px;
  }
  .feature-item {
      font-size: 14px;
  }
  .hero-title {
    font-size: 32px;
    line-height: 42px;
  }
  .hero-features {
    row-gap: 6px;
    margin-bottom: 20px;
  }
  .hero-img img{
    width: 100%;
    height: auto;
    left: -60px;
    position: relative;
  }
  .section-description {
      font-size: 14px;
      line-height: 22px;
  }
  .section-title {
      font-size: 20px;
      margin: 3px 0 3px 0;
  }
  .section-tag {
    margin-bottom: 0px;
  }
  .div-cards-list {
    --cols: 1;
    margin-bottom: 0;
  }
  .div-cards__icon::before, .div-cards__icon::after{
    display: none;
  }
  .div-cards__item {
    padding-top: 100px;
    padding-right: 35px;
  }
  .right-icon .div-cards__icon,
  .left-icon .div-cards__icon  {
    right: 10%;
    top: -70px;
    left: auto;
  }
  .right-icon.div-cards__item {
    padding-right: 35px;
    margin-bottom: 70px;
  }
  .left-icon.div-cards__item{
    padding-left: 35px;
  }
  .div-cards-list {
    padding: 30px 40px 40px 30px;
  }
  .target-cards{
    gap: 20px;
  }
  .target-card{
    flex: 1 0 100%;
  }
  .step-card:not(:first-child)::before {
    left: 91%;
    top: -20px;
    height: 35px;
    width: 2px;
    background: linear-gradient(60deg, #21a62500 0%, #21a62585 90%);
    z-index: 2;
  }
  .stat-2 {
    right: -90px;
  }
  .journey-steps {
    --cols: 1;
  }
}

/* Small devices (landscape phones, 576px : 768px) */
@media (min-width: 576px) and (max-width: 767.98px) {
  .navbar-collapse{
    background: linear-gradient(167deg, #1c4450 7.81%, #1c4450 17.18%, #163b3b 32.32%, #123a31 53.13%, #143a36 73.43%, #183e42 88.61%);
    padding: 10px 20px 20px;
  }
  .navbar.scrolled .navbar-collapse{
    background: none;
    padding-bottom: 10px;
  }
  .navbar,.navbar.scrolled {
    padding: 5px 20px;
  }
  .container, .container-fluid, .container-xxl, .container-xl, .container-lg, .container-md, .container-sm {
    padding-left: 30px;
    padding-right: 30px;
  }
  .container, .container-sm {
    max-width: none;
  }
  .padd-100 {
    padding: 50px 0;
  }
  .padd-80 {
    padding: 40px 0;
  }
  .padd-60 {
    padding: 40px 0;
  }
  .sec-title{
    margin-bottom: 30px !important;
  }
  .hero-content {
    position: relative;
    z-index: 10;
    padding: 90px 0 20px 0;
  }
  .main-section__title {
    width: 100%;
    font-size: 20px;
  }
  .stat-label {
      font-size: 14px;
      line-height: 10px;
  }
  .stat-value {
    font-size: 15px;
  }
  .hero-description{
    font-size: 15px;
    line-height: 23px;
  }
  .feature-item {
      font-size: 14px;
  }
  .hero-title {
    font-size: 32px;
    line-height: 42px;
  }
  .hero-features {
    row-gap: 6px;
    margin-bottom: 20px;
  }
  .hero-img img{
    width: 100%;
    height: auto;
    left: -60px;
    position: relative;
  }
  .section-description {
      font-size: 14px;
      line-height: 22px;
  }
  .section-title {
      font-size: 20px;
      margin: 3px 0 3px 0;
  }
  .section-tag {
    margin-bottom: 0px;
  }
  .div-cards-list {
    --cols: 1;
    margin-bottom: 0;
  }
  .div-cards__icon::before, .div-cards__icon::after{
    display: none;
  }
  .div-cards__item {
    padding-top: 100px;
    padding-right: 35px;
  }
  .right-icon .div-cards__icon,
  .left-icon .div-cards__icon  {
    right: 10%;
    top: -70px;
    left: auto;
  }
  .right-icon.div-cards__item {
    padding-right: 35px;
    margin-bottom: 70px;
  }
  .left-icon.div-cards__item{
    padding-left: 35px;
  }
  .div-cards-list {
    padding: 30px 40px 40px 30px;
  }
  .target-cards{
    gap: 20px;
  }
  .target-card{
    flex: 1 0 100%;
  }
  .step-card:not(:first-child)::before {
    right: 37px;
    left: auto;
    top: -20px;
    height: 35px;
    width: 2px;
    background: linear-gradient(60deg, #21a62500 0%, #21a62585 90%);
    z-index: 2;
  }
  .stat-2 {
    right: -90px;
  }
  .journey-steps {
    --cols: 1;
  }
  
}

/* Medium devices (tablets, 768px : 992px) */
@media (min-width: 768px) and (max-width: 991.98px) {

  .navbar-collapse{
    background: linear-gradient(167deg, #1c4450 7.81%, #1c4450 17.18%, #163b3b 32.32%, #123a31 53.13%, #143a36 73.43%, #183e42 88.61%);
    padding: 10px 20px 20px;
  }
  .navbar.scrolled .navbar-collapse{
    background: none;
    padding-bottom: 10px;
  }
  .navbar,.navbar.scrolled {
    padding: 5px 20px;
  }
  .container, .container-fluid, .container-xxl, .container-xl, .container-lg, .container-md, .container-sm {
    padding-left: 30px;
    padding-right: 30px;
  }
  .container, .container-sm {
    max-width: none;
  }
  .padd-100 {
    padding: 50px 0;
  }
  .padd-80 {
    padding: 40px 0;
  }
  .padd-60 {
    padding: 40px 0;
  }
  .sec-title{
    margin-bottom: 30px !important;
  }
  .hero-content {
    position: relative;
    z-index: 10;
    padding: 90px 0 20px 0;
  }
  .main-section__title {
    width: 100%;
    font-size: 20px;
  }
  .stat-label {
      font-size: 14px;
      line-height: 10px;
  }
  .stat-value {
    font-size: 15px;
  }
  .hero-description{
    font-size: 15px;
    line-height: 23px;
  }
  .feature-item {
      font-size: 14px;
  }
  .hero-title {
    font-size: 32px;
    line-height: 42px;
  }
  .hero-features {
    row-gap: 6px;
    margin-bottom: 20px;
  }
  .hero-img img{
    width: 100%;
    height: auto;
    left: -60px;
    position: relative;
  }
  .section-description {
      font-size: 14px;
      line-height: 22px;
  }
  .section-title {
      font-size: 20px;
      margin: 3px 0 3px 0;
  }
  .section-tag {
    margin-bottom: 0px;
  }
  .div-cards-list {
    --cols: 1;
    margin-bottom: 0;
  }
  .div-cards__icon::before, .div-cards__icon::after{
    display: none;
  }
  .div-cards__item {
    padding-top: 100px;
    padding-right: 35px;
  }
  .right-icon .div-cards__icon,
  .left-icon .div-cards__icon  {
    right: 10%;
    top: -70px;
    left: auto;
  }
  .right-icon.div-cards__item {
    padding-right: 35px;
    margin-bottom: 70px;
  }
  .left-icon.div-cards__item{
    padding-left: 35px;
  }
  .div-cards-list {
    padding: 30px 40px 40px 30px;
  }
  .target-cards{
    gap: 20px;
  }
  .target-card{
    flex: 1 0 100%;
  }
  .step-card:not(:first-child)::before {
    right: 37px;
    left: auto;
    top: -20px;
    height: 35px;
    width: 2px;
    background: linear-gradient(60deg, #21a62500 0%, #21a62585 90%);
    z-index: 2;
  }
  .stat-2 {
    right: -90px;
  }
  .journey-steps {
    --cols: 1;
  }
}

/* Large devices (desktops, 992px : 1200px) */
@media (min-width: 992px) and (max-width: 1199.98px) {
  .container, .container-fluid, .container-xxl, .container-xl, .container-lg, .container-md, .container-sm {
      padding-left: 30px;
      padding-right: 30px;
  }
  .container, .container-sm {
      max-width: none;
  }
  .padd-80 {
      padding: 40px 0;
  }
  .padd-60 {
      padding: 40px 0;
  }
  .main-section__title {
    width: 100%;
  }
}

/* Extra large devices (large desktops, 1200px : 1400px) */
@media (min-width: 1200px) and (max-width: 1399.98px) {
  .container, .container-fluid, .container-xxl, .container-xl, .container-lg, .container-md, .container-sm {
      padding-left: 30px;
      padding-right: 30px;
  }
  .container, .container-sm {
      max-width: none;
  }
  .padd-80 {
      padding: 40px 0;
  }
  .padd-60 {
      padding: 40px 0;
  }
  .main-section__title {
    width: 100%;
  }
}

/* 2X Large devices (1400px : 1499px) */
@media (min-width: 1400px) and (max-width: 1499.9px) {
  .hero-frame-image-box {
      left: -40px;
      bottom: -4px;
      width: 790px;
      height: 400px;
  }
}

/* 2X Large devices (1400px : 1599px) WS--LP */
@media (min-width: 1400px) and (max-width: 1599.98px) {
  .memb-card{
    height: 400px;
  }
}

/* 3X Large devices (1600px : 1920px) */
@media (min-width: 1600px) and (max-width: 1919.98px) {
}

/* 4K / Ultra wide screens (1920px) WS--SCRN--23 */
@media (min-width: 1920px) {

}