/* MAIN DIV */
.select {
    width: 80%;
    margin: 0 auto;
    height: 3.5rem;
    position: relative;
    z-index: 2;
  }
  /* TRINGLE BUTTON */
  .select-toggle {
    z-index: 99;
    top: 3px;
    right: 170px;
    height: 2.5rem;
    width: 2.5rem;
    background: white;
    border: none;
    position: absolute;
  }
  .select-toggle.active::after {
    transform: rotate(135deg);
  }
  .select-toggle.active::before {
    transform: rotate(-135deg);
  }
  .select-toggle:after,
  .select-toggle::before {
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
    content: "";
    background: #434341;
    position: absolute;
    top: 1.7rem;
    left: calc(1.5rem - 5px);
    width: 6px;
    height: 2px;
  }
  .select-toggle:after {
    left: calc(1.5rem - 8px);
    transform: rotate(45deg);
  }
  .select-toggle::before {
    transform: rotate(-45deg);
  }
  /* SELECTS LIST  */
  .select .tabs {
    margin: 0;
    border: 1px solid #ddd;
    border-radius: 11px;
    padding: 0;
    position: absolute;
    overflow: hidden;
    counter-reset: num;
    list-style-type: none;
    width: 55%;
    height: 3.5rem;
    flex-wrap: wrap;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
    /* filter: drop-shadow(0px 4px 4px rgba(0,0,0, .25)); */
    box-shadow: 0px 4px 6px 0px rgb(12 0 46 / 6%);
  }
  /* SELECT ITEM */
  .select .tabs li {
    cursor: pointer;
    box-sizing: border-box;
    align-items: center;
    background: #ffffff;
    height: 3.5rem;
    display: flex;
    width: 100%;
    padding: 0 0.4rem 0 1rem;
    -webkit-transition: all 0.2s;
    -moz-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
    line-height: 1.6rem;
    font-weight: 500;
    font-size: 15px;
    color: #434341;
    border-bottom: 1px solid #e5e5e5;
  }
  
  /* CURRENT SELECT */
  .select .tabs li.current {
    order: -1;
    z-index: 3;
  }
  
  /* COUNTER */
  .select .tabs li:before {
    color: white;
    font-size: 1.1rem;
    content: counter(num, decimal-leading-zero);
    counter-increment: num;
    /* margin-right: 1.571rem; */
    font-weight: 500;
    line-height: 1.6rem;
  }
  
  /* TABS */
  #tabs-1 {
    background: none;
  }
  #tabs-2 {
    background: none;
  }
  #tabs-3 {
    background: none;
  }
  #tabs-4 {
    background: none;
  }
  .tab-contenty {
    /* width: 100%; */
    /* height: 15rem; */
    /* text-align: center; */
    /* padding-top: 5rem; */
    padding-right: 26px;
    display: none;
  }
  .tab-contenty.current {
    display: block;
  }
  
  .flexbox {
    display: flex;
    align-items: center;
    align-self: center;
  }
  
  .design-process-section .text-align-center {
    line-height: 25px;
    margin-bottom: 12px;
  }
  
  .design-process-content {
    border: 1px solid #29602e;
    border-radius: 12px;
    background-color: #29602e;
    background: url(../img/pattern.png), linear-gradient(209deg, #29602e 0%, #29602e 100%);
    width: 100%;
    min-height: 640px;
    position: relative;
    float: right;
    padding: 26px 40px 30px 30px;
  }
  
  .design-process-content ul li {
    margin-top: 12px;
    color: #fff;
  }
  .design-process-content h4 {
    margin-top: 12px;
    color: #fff;
    margin-right: 10px;
  }
  
  .design-process-content img {
    position: absolute;
    /* top: 0; */
    /* left: 0; */
    /* bottom: 0; */
    /* z-index: 0; */
    right: 0;
    margin-top: -7px;
    width: 52px;
    max-height: 100%;
  }
  
  .design-process-content h3 {
    margin-bottom: 16px;
    color: #fff;
  }
  
  .design-process-content p {
    line-height: 26px;
    margin-bottom: 12px;
    color: #fff;
  }
  
  .process-modell {
    list-style: none;
    padding: 0;
    position: relative;
    max-width: 90%;
    margin: 20px auto 26px;
    border: none;
    z-index: 0;
    background: url(../img/line_group.svg);
    background-size: 88%;
    background-position: top 21% left 1px;
    background-repeat: no-repeat;
  }
  
  .process-modell li::after {
    /* background: #e5e5e5 none repeat scroll 0 0; */
    /* border-top: 4px dotted #e5e5e5; */
    bottom: 0;
    content: "";
    display: block;
    height: 4px;
    margin: 0 auto;
    position: absolute;
    left: -34px;
    top: 31px;
    width: 50%;
    z-index: -1;
  }
  
  .process-modell li.visited::after {
    background: #29602e;
    /* border-top: 5px dotted #29602e; */
    -webkit-transition: width 0.3s linear;
    transition: width 0.3s linear;
  }
  
  .process-modell li:nth-child(4)::after {
    /* background: #e5e5e5 none repeat scroll 0 0; */
    /* border-top: 4px dotted #e5e5e5; */
    bottom: 0;
    content: "";
    display: block;
    height: 154px;
    margin: 0 auto;
    position: absolute;
    left: -14px;
    top: 31px;
    width: 401%;
    z-index: -1;
  }
  
  .process-modell li:nth-child(4).visited::after {
    /* background: #29602e; */
    /* border-top: 5px dotted #ffffff; */
    background: url(../img/line_group_hover.svg);
    background-position: top 0px left 14px;
    background-repeat: no-repeat;
    background-size: 88%;
    -webkit-transition: width 0.3s linear;
    transition: width 0.3s linear;
  }
  
  .process-modell li:nth-child(8)::after {
    /* background: #e5e5e5 none repeat scroll 0 0; */
    /* border-top: 4px dotted #e5e5e5; */
    bottom: 0;
    content: "";
    display: block;
    height: 154px;
    margin: 0 auto;
    position: absolute;
    left: -14px;
    top: 32px;
    width: 401%;
    z-index: -1;
  }
  
  .process-modell li:nth-child(8).visited::after {
    /* background: #29602e; */
    /* border-top: 5px dotted #ffffff; */
    background: url(../img/line_group_hover.svg);
    background-position: top 0px left 14px;
    background-repeat: no-repeat;
    background-size: 88%;
    -webkit-transition: width 0.3s linear;
    transition: width 0.3s linear;
  }
  .process-modell li:nth-child(11)::after {
    /* background: #e5e5e5 none repeat scroll 0 0; */
    /* border-top: 4px dotted #e5e5e5; */
    bottom: 0;
    content: "";
    display: block;
    height: 205px;
    margin: 0 auto;
    position: absolute;
    left: -28px;
    top: 33px;
    width: 334%;
    z-index: -1;
  }
  .process-modell li:nth-child(11).visited::after {
    background: #29602e;
    /* border-top: 5px dotted #29602e; */
    -webkit-transition: width 0.3s linear;
    transition: width 0.3s linear;
    background: url(../img/11_step.svg);
    background-position: top 0px left -22px;
    background-repeat: no-repeat;
    background-size: 88%;
    -webkit-transition: width 0.3s linear;
    transition: width 0.3s linear;
  }
  
  .process-modell li:nth-child(12)::after {
    /* background: #e5e5e5 none repeat scroll 0 0; */
    /* border-top: 4px dotted #e5e5e5; */
    bottom: 0;
    content: "";
    display: block;
    height: 244px;
    margin: 0 auto;
    position: absolute;
    left: -14px;
    top: 33px;
    width: 401%;
    z-index: -1;
  }
  
  .process-modell li:nth-child(12).visited::after {
    /* background: #29602e; */
    /* border-top: 5px dotted #ffffff; */
    background: url(../img/last_step.svg);
    background-position: top 0px left 14px;
    background-repeat: no-repeat;
    background-size: 88%;
    -webkit-transition: width 0.3s linear;
    transition: width 0.3s linear;
  }
  
  .process-modell li:last-child::after {
    width: 0;
  }
  
  .process-modell li {
    width: calc(100% / 4);
    margin-bottom: 6%;
    text-align: center;
    float: right;
    position: relative;
  }
  
  .nav-tabs.process-modell > li.active > a,
  .nav-tabs.process-modell > li.active > a:hover,
  .nav-tabs.process-modell > li.active > a:focus,
  .process-modell li a:hover,
  .process-modell li a:focus {
    border: none;
    background: transparent;
  }
  
  .process-modell li a {
    padding: 0;
    border: none;
    color: #606060;
  }
  
  .process-modell li.active,
  .process-modell li.visited {
    color: #29602e;
  }
  
  .process-modell li.active a,
  .process-modell li.active a:hover,
  .process-modell li.active a:focus,
  .process-modell li.visited a,
  .process-modell li.visited a:hover,
  .process-modell li.visited a:focus {
    color: #29602e;
  }
  
  .process-modell li.active p,
  .process-modell li.visited p {
    /* font-weight: 500; */
    font-family: "DINNextLTArabic-Bold", sans-serif;
  }
  
  .process-modell li.active p {
    /* font-weight: 500; */
    /* font-size: 16px; */
    color: #29602e;
    font-family: "DINNextLTArabic-Bold", sans-serif;
  }
  
  .process-modell li i {
    display: block;
    height: 68px;
    width: 68px;
    text-align: center;
    margin: 0px auto;
    background: #f5f6f7;
    border: 2px solid #e5e5e5;
    line-height: 65px;
    font-size: 48px;
    border-radius: 50%;
  }
  
  .process-modell li.active i,
  .process-modell li.visited i {
    background: #fff;
    border-color: #29602e;
  }
  
  .process-modell li.active i {
    background-color: #29602e;
    border-color: #29602e;
    color: #fff;
  }
  
  .process-modell li p {
    font-size: 14px;
    font-family: "DINNextLTArabic-Medium", sans-serif;
    /* margin-top: 11px; */
    margin: 4px;
    margin-bottom: 22px;
  }
  
  .process-modell.contact-us-tab li.visited a,
  .process-modell.contact-us-tab li.visited p {
    color: #606060 !important;
    font-weight: normal;
  }
  
  .process-modell.contact-us-tab li::after {
    display: none;
  }
  
  .process-modell.contact-us-tab li.visited i {
    border-color: #e5e5e5;
  }
  
  .upcoming-event-bar {
    background: #ffffff;
    padding: 14px;
    border-radius: 8px;
    border-bottom: 1px solid #eaeaea;
  }
  .upcoming-event-bar h3 {
    margin-bottom: 0;
  }
  .upcoming-event-bar .action-buttons {
    margin-top: 0;
  }
  .upcoming-event-bar .counter .timer-col {
    margin-bottom: 0;
  }
  .upcoming-event-bar .counter .timer-col #days,
  .upcoming-event-bar .counter .timer-col #daysLeft,
  .upcoming-event-bar .counter .timer-col #weeks,
  .upcoming-event-bar .counter .timer-col #months,
  .upcoming-event-bar .counter .timer-col #hours,
  .upcoming-event-bar .counter .timer-col #minutes,
  .upcoming-event-bar .counter .timer-col #seconds {
    border-color: #ccc;
    background-color: #f4f4ec;
  }
  .featured-block {
    margin-bottom: 20px;
  }
  .featured-block figure {
    position: relative;
    z-index: 1;
    display: block;
    overflow: hidden;
    text-align: center;
    cursor: pointer;
  }
  .featured-block figure figcaption::before,
  .featured-block figure figcaption::after {
    pointer-events: none;
  }
  .featured-block figure {
    margin-bottom: 20px;
  }
  .featured-block figure img {
    position: relative;
    display: block;
    opacity: 0.5;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
  }
  .featured-block:hover figure img {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0) scale(1);
    transform: translate3d(0, 0, 0) scale(1);
  }
  .featured-block p {
    padding: 0 20px 0 0;
  }
  .content {
    padding: 50px 0;
  }
  .home .content {
    padding-top: 30px;
  }
  .home-style2 .content {
    padding-bottom: 0;
    padding-top: 50px;
  }
  .upcoming-event {
    margin-top: 5px;
  }
  .upcoming-event h3 {
    margin-bottom: 11px;
  }
  .upcoming-event-content {
    background: #f8f8f8;
    padding: 20px;
    padding-bottom: 20px;
    position: relative;
    -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
  }
  .upcoming-event .meta-data {
    font-size: 13px;
  }
  .upcoming-event .meta-data span {
    margin-right: 0;
  }
  .upcoming-event-label {
    position: absolute;
    top: -20px;
    left: 0;
    height: 20px;
    line-height: 18px;
    -webkit-border-radius: 0;
    border-radius: 0;
  }
  .counter .timer-col {
    margin-top: 6px;
    margin-right: 2px;
    width: 39%;
    float: right;
    margin-bottom: 20px;
  }
  .counter .timer-col #days,
  .counter .timer-col #weeks,
  .counter .timer-col #months,
  .counter .timer-col #hours,
  .counter .timer-col #minutes,
  .counter .timer-col #seconds,
  .counter .timer-col #daysLeft {
    -webkit-border-radius: 100%;
    border-radius: 100%;
    border: 3px solid #efefef;
    display: inline-block;
    width: 50px;
    height: 50px;
    line-height: 42px;
    font-weight: 700;
    color: #636362;
    font-size: 16px;
    text-align: center;
  }
  .counter .timer-col .timer-type {
    width: 48px;
    display: block;
    text-align: center;
    font-size: 14px;
  }
  
  .addeventatc {
    display: inline-block;
    position: relative;
    z-index: 2 !important;
    margin-top: 27px;
    font-family: "DINNextLTArabic-Regular", sans-serif !important;
    color: #fff !important;
    font-weight: 600;
    line-height: 100%;
    background: #d3a260 !important;
    font-size: 15px;
    text-decoration: none;
    border: 1px solid transparent;
    padding: 13px 12px 12px 43px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    cursor: pointer;
    -webkit-font-smoothing: antialiased !important;
    outline-color: rgba(0, 78, 255, 0.5);
    text-shadow: 1px 1px 1px rgb(0 0 0 / 0%);
    -webkit-user-select: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    box-shadow: 0 0 0 0.5px rgba(50, 50, 93, 0.17), 0 2px 5px 0 rgba(50, 50, 93, 0.1), 0 1px 1.5px 0 rgba(0, 0, 0, 0.07),
      0 1px 2px 0 rgba(0, 0, 0, 0.08), 0 0 0 0 transparent !important;
    background-position: -9999px -9999px;
    background-repeat: no-repeat;
  }
  
  .addeventatc .addeventatc_icon {
    width: 18px;
    height: 18px;
    position: absolute;
    z-index: 1;
    left: 12px;
    top: 10px;
    background: url(../img/icon-calendar-t1.svg) no-repeat !important;
    background-size: 18px 18px;
  }
  
  .addeventatc .start,
  .addeventatc .end,
  .addeventatc .timezone,
  .addeventatc .title,
  .addeventatc .description,
  .addeventatc .location,
  .addeventatc .organizer,
  .addeventatc .organizer_email,
  .addeventatc .facebook_event,
  .addeventatc .all_day_event,
  .addeventatc .date_format,
  .addeventatc .alarm_reminder,
  .addeventatc .recurring,
  .addeventatc .attendees,
  .addeventatc .calname,
  .addeventatc .uid,
  .addeventatc .sequence,
  .addeventatc .status,
  .addeventatc .method,
  .addeventatc .client,
  .addeventatc .transp {
    display: none !important;
  }
  
  .event-title p {
    /* color: #bf9660; */
    margin-top: 6px;
    font-size: 17px;
  }
  
  /* ----- process haj and omrah -------*/
  .process-bar {
    /* position: absolute; */
    display: block;
    top: 50%;
    /* right: 10%; */
    transform: translate(0%, 0%);
    font-size: 16px;
    color: #555;
  }
  
  .process-list {
    list-style: none;
    position: relative;
    top: 3px;
     right: 10%; 
    margin: 0;
    padding: 0;
    /*padding-right: 40px;*/
    counter-reset: step;
  }
  
  .process-list:before {
    content: "";
    position: absolute;
    top: 0px;
    right: -28px;
    height: 89%;
    border-left: 3px solid #2d652f;
    z-index: -1;
  }

.process-item {
    margin-top: 25px;
    font-weight: bold;
    position: relative;
    z-index: 100;
    text-align: right;
}

    .process-item:before {
        content: counter(step);
        counter-increment: step;
        display: block;
        text-align: center;
        position: absolute;
        top: -3px;
        right: -44px;
        width: 35px;
        height: 35px;
        border-radius: 50%;
        border: 2px solid #0c0765;
        margin: 0 auto 0 auto;
        line-height: 32px;
        color: #fff;
        z-index: 300;
        background-color: #0c0765;
    }

   /* .process-item:before {
        content: counter(step);
        counter-increment: step;
        display: block;
        text-align: center;
        position: absolute;
        top: -3px;
        right: -44px;
        width: 35px;
        height: 35px;
        border-radius: 50%;
        border: 2px solid #9a9acb;
        margin: 0 auto 0 auto;
        line-height: 32px;
        color: #fff;
        z-index: 300;
        background-color: #737cae;
    }
  */
  .company-scroll {
    height: 294px;
    overflow: auto;
    border: 1px solid #d9dce0;
    border-radius: 11px;
    padding: 14px;
  }
  
  @media (min-width: 1400px) {
    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
      max-width: 1320px;
    }
  }
  
  @media (max-width: 1310px) {
    .process-modell li {
      width: calc(100% / 4);
      margin-bottom: 5%;
      text-align: center;
      float: right;
      position: relative;
    }
  }
  
  @media (max-width: 1270px) {
    .process-modell li {
      width: calc(100% / 4);
      margin-bottom: 5%;
      text-align: center;
      float: right;
      position: relative;
    }
    .process-modell {
      background: none;
    }
  }
  
  @media (min-width: 1200px) {
    .display-1 {
      font-size: 2.4rem;
      text-align: center;
      /* margin-top: 5rem; */
      color: #2d652f;
      font-family: "DINNextLTArabic-Bold", sans-serif;
    }
  }
  
  @media (max-width: 1100px) {
    .process-modell {
      max-width: none;
    }
  }
  
  @media (min-width: 992px) {
    .upcoming-event-bar .text-align-right {
      text-align: center !important;
    }
    .upcoming-event-bar .event-register-button {
      margin-left: 30px;
    }
    .upcoming-event-bar .action-buttons {
      display: inline-block;
      margin-top: 10px;
    }
    .blog-classic-listing .post-thumb {
      margin-bottom: 20px;
    }
    .topbar .container {
      width: 100%;
    }
    .container,
    .container-fluid,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
      padding: 0 50px !important;
    }
  }
  
  @media (max-width: 991.98px) {
    .container,
    .container-fluid,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
      max-width: none;
      padding: 0 20px !important;
    }
    .header-tablet-and-mobile-fixed[data-kt-sticky-header="on"] .wrapper {
      padding-top: 55px;
    }
  }
  
  @media (min-width: 992px) {
    .container,
    .container-fluid,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
      padding: 0 30px;
    }
    .docs-wrapper {
      padding-left: 265px;
    }
  }
  
  @media (max-width: 991.98px) {
    .container,
    .container-fluid,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
      max-width: none;
      padding: 0 15px;
    }
  }
  
  @media (max-width: 780px) {
    .process-modell {
      list-style: none;
      padding: 0;
      position: relative;
      max-width: 90%;
      margin: 20px auto 26px;
      border: none;
      z-index: 0;
      background: none;
      background-position: top 33px left 0px;
      background-repeat: no-repeat;
    }
    .header_area {
      top: 54px;
    }
    .brd {
      height: 12vh;
      margin-top: 110px;
      margin-bottom: 12px;
      background-color: #f9f9f9;
    }
    .header-bottom .brand {
      width: 300px;
      margin-right: 23%;
      margin-bottom: 6px;
    }
    .design-process-content h4 {
      margin-right: 40px;
    }
    .process-modell li::after {
      right: 32px;
    }
  
    .process-modell li:nth-child(4)::after {
      /* background: #e5e5e5 none repeat scroll 0 0; */
      /* border-top: 4px dotted #e5e5e5; */
      bottom: 0;
      content: "";
      display: block;
      height: 154px;
      margin: 0 auto;
      position: absolute;
      right: -214px;
      top: 33px;
      width: 500px;
      z-index: -1;
    }
  
    .process-modell li:nth-child(4).visited::after {
      /* background: #29602e; */
      /* border-top: 5px dotted #ffffff; */
      background: url(../img/line_group_hover.svg);
      background-position: top 0px left 199px;
      background-repeat: no-repeat;
      background-size: 53%;
      -webkit-transition: width 0.3s linear;
      transition: width 0.3s linear;
    }
  
    .process-modell li:nth-child(8)::after {
      /* background: #e5e5e5 none repeat scroll 0 0; */
      /* border-top: 4px dotted #e5e5e5; */
      bottom: 0;
      content: "";
      display: block;
      height: 154px;
      margin: 0 auto;
      position: absolute;
      right: -214px;
      top: 33px;
      width: 500px;
      z-index: -1;
    }
  
    .process-modell li:nth-child(8).visited::after {
      /* background: #29602e; */
      /* border-top: 5px dotted #ffffff; */
      background: url(../img/line_group_hover.svg);
      background-position: top 0px left 199px;
      background-repeat: no-repeat;
      background-size: 53%;
      -webkit-transition: width 0.3s linear;
      transition: width 0.3s linear;
    }
  
    .process-modell li:nth-child(12)::after {
      /* background: #e5e5e5 none repeat scroll 0 0; */
      /* border-top: 4px dotted #e5e5e5; */
      bottom: 0;
      content: "";
      display: block;
      height: 154px;
      margin: 0 auto;
      position: absolute;
      right: -214px;
      top: 33px;
      width: 500px;
      z-index: -1;
    }
  
    .process-modell li:nth-child(12).visited::after {
      /* background: #29602e; */
      /* border-top: 5px dotted #ffffff; */
      /* background: url(../img/line_group_hover_last.svg); */
      background-position: top 0px left 199px;
      background-repeat: no-repeat;
      background-size: 53%;
      -webkit-transition: width 0.3s linear;
      transition: width 0.3s linear;
    }
  
    .process-modell li {
      width: calc(100% / 4);
      margin-bottom: 5px;
      width: 23%;
      text-align: center;
      float: right;
      position: relative;
    }
  
    .process-modell li::after {
      bottom: 0;
  
      content: "";
  
      display: block;
  
      height: 2.2px;
  
      margin: 0 auto;
  
      position: absolute;
  
      left: -34px;
  
      top: 33px;
  
      width: 50%;
  
      z-index: -1;
    }
  
    .process-modell li.active p,
    .process-modell li.visited p {
      /* font-weight: 500; */
      font-family: "DINNextLTArabic-Medium", sans-serif;
    }
  
    .process-modell li.active p {
      color: #29602e;
      font-family: "DINNextLTArabic-Medium", sans-serif;
    }
  }
  
  @media screen and (max-width: 778px) {
    .upcoming-event-bar .counter {
      margin-top: 8px;
    }
    .process-modell.more-icon-preocess li {
      width: 25%;
    }
    .more-icon-preocess.process-modell li span {
      /* font-size: 16px; */
      height: 35px;
      line-height: 32px;
      width: 35px;
    }
    .more-icon-preocess.process-modell li p {
      font-size: 9px;
      line-height: 14px;
    }
    .more-icon-preocess.process-modell li::after {
      /* top: 18px !important; */
    }
    .process-modell.more-icon-preocess {
      text-align: center;
    }
  }
  
  @media screen and (max-width: 560px) {
    .process-modell li i {
      display: block;
      height: 42px;
      width: 42px;
      text-align: center;
      margin: 0 auto;
      background: #f5f6f7;
      border: 2px solid #e5e5e5;
      line-height: 39px;
      font-size: 29px;
      border-radius: 50%;
    }
    .process-modell {
      list-style: none;
      padding: 0;
      position: relative;
      max-width: 100%;
      margin: 0;
      border: none;
      z-index: 0;
      margin-left: 0px;
      background: url(../img/line_group.svg);
      background-position: top 18px left 39px;
      background-repeat: no-repeat;
      background-size: 77%;
    }
  
    .design-process-content {
      border: 1px solid #29602e;
      background-color: #29602e;
      width: 100%;
      position: relative;
      height: 100%;
      float: none;
      padding: 16px 12px 30px 12px;
      min-height: 100%;
    }
  
    .more-icon-preocess.process-modell li span {
      /* font-size: 23px; */
      height: 50px;
      line-height: 46px;
      width: 50px;
    }
    .more-icon-preocess.process-modell li::after {
      top: 24px;
    }
  }
  
  .display-1 {
    font-size: calc(1.365rem + 1.38vw);
    line-height: 1.2;
    color: #2d652f;
    text-align: center;
  }
  
  @media (max-width: 650px) {
    .process-modell li:nth-child(11)::after {
      right: -168px;
    }
    .addeventatc {
      margin-top: 4px;
      z-index: 2 !important;
    }
    .counter .timer-col {
      margin-top: 2px;
      margin-right: 1px;
      width: 21%;
      float: right;
      margin-bottom: 20px;
    }
    .event-title p {
      font-size: 13px;
    }
    .display-1 {
      font-size: calc(1.365rem + 3.38vw);
      line-height: 1.2;
      color: #2d652f;
      text-align: center;
      font-family: "DINNextLTArabic-Medium";
    }
    .header_area {
      top: 54px;
    }
    .brd {
      height: 12vh;
      margin-top: 110px;
      margin-bottom: 12px;
      background-color: #f9f9f9;
    }
    .header-bottom .brand {
      width: 300px;
      margin-right: 23%;
      margin-bottom: 6px;
    }
    .design-process-content h4 {
      margin-right: 40px;
    }
    .process-modell li::after {
      right: 32px;
    }
  
    .process-modell li:nth-child(4)::after {
      /* background: #e5e5e5 none repeat scroll 0 0; */
      /* border-top: 4px dotted #e5e5e5; */
      bottom: 0;
      content: "";
      display: block;
      height: 154px;
      margin: 0 auto;
      position: absolute;
      right: -214px;
      top: 33px;
      width: 500px;
      z-index: -1;
    }
  
    .process-modell li:nth-child(4).visited::after {
      /* background: #29602e; */
      /* border-top: 5px dotted #ffffff; */
      background: url(../img/line_group_hover.svg);
      background-position: top 0px left 217px;
      background-repeat: no-repeat;
      background-size: 49%;
      -webkit-transition: width 0.3s linear;
      transition: width 0.3s linear;
    }
  
    .process-modell li:nth-child(8)::after {
      /* background: #e5e5e5 none repeat scroll 0 0; */
      /* border-top: 4px dotted #e5e5e5; */
      bottom: 0;
      content: "";
      display: block;
      height: 154px;
      margin: 0 auto;
      position: absolute;
      right: -214px;
      top: 33px;
      width: 500px;
      z-index: -1;
    }
  
    .process-modell li:nth-child(8).visited::after {
      /* background: #29602e; */
      /* border-top: 5px dotted #ffffff; */
      background: url(../img/line_group_hover.svg);
      background-position: top 2px left 217px;
      background-repeat: no-repeat;
      background-size: 49%;
      -webkit-transition: width 0.3s linear;
      transition: width 0.3s linear;
    }
  
    .process-modell li:nth-child(12)::after {
      /* background: #e5e5e5 none repeat scroll 0 0; */
      /* border-top: 4px dotted #e5e5e5; */
      bottom: 0;
      content: "";
      display: block;
      height: 154px;
      margin: 0 auto;
      position: absolute;
      right: -214px;
      top: 33px;
      width: 500px;
      z-index: -1;
    }
  
    .process-modell li:nth-child(12).visited::after {
      /* background: #29602e; */
      /* border-top: 5px dotted #ffffff; */
      /* background: url(../img/line_group_hover_last.svg); */
      background-position: top 4px left 217px;
      background-repeat: no-repeat;
      background-size: 49%;
      -webkit-transition: width 0.3s linear;
      transition: width 0.3s linear;
    }
  
    .process-modell li {
      width: calc(100% / 4);
      margin-bottom: 5px;
      width: 23%;
      text-align: center;
      float: right;
      position: relative;
    }
  
    .process-modell li::after {
      bottom: 0;
  
      content: "";
  
      display: block;
  
      height: 2.2px;
  
      margin: 0 auto;
  
      position: absolute;
  
      left: -34px;
  
      top: 33px;
  
      width: 50%;
  
      z-index: -1;
    }
  
    .process-modell li.active p,
    .process-modell li.visited p {
      /* font-weight: 500; */
      font-family: "DINNextLTArabic-Medium", sans-serif;
    }
  
    .process-modell li.active p {
      color: #29602e;
      font-family: "DINNextLTArabic-Medium", sans-serif;
    }
  }
  
  @media screen and (max-width: 560px) {
    .process-modell.more-icon-preocess li {
      width: 22%;
    }
    .more-icon-preocess.process-modell li span {
      /* font-size: 16px; */
      height: 35px;
      line-height: 32px;
      width: 35px;
    }
    .more-icon-preocess.process-modell li p {
      font-size: 9px;
      line-height: 14px;
    }
    .more-icon-preocess.process-modell li::after {
      top: 18px !important;
    }
    .process-modell.more-icon-preocess {
      text-align: center;
    }
  }
  
  @media screen and (max-width: 380px) {
    .process-modell.more-icon-preocess li {
      width: 25%;
    }
    .process-modell {
      list-style: none;
      padding: 0;
      position: relative;
      max-width: 100%;
      margin: 0;
      border: none;
      z-index: 0;
      margin-left: 0px;
      background: url(../img/line_group_mobile.svg);
      background-position: top 18px left 0px;
      background-repeat: no-repeat;
      background-size: 89%;
    }
    .more-icon-preocess.process-modell li p {
      font-size: 9px;
      line-height: 14px;
    }
  
    .process-modell li:nth-child(4)::after {
      /* background: #e5e5e5 none repeat scroll 0 0; */
      /* border-top: 4px dotted #e5e5e5; */
      bottom: 0;
      content: "";
      display: block;
      height: 154px;
      margin: 0 auto;
      position: absolute;
      right: -214px;
      top: 33px;
      width: 500px;
      z-index: -1;
    }
  
    .process-modell li:nth-child(8)::after {
      /* background: #e5e5e5 none repeat scroll 0 0; */
      /* border-top: 4px dotted #e5e5e5; */
      bottom: 0;
      content: "";
      display: block;
      height: 154px;
      margin: 0 auto;
      position: absolute;
      right: -214px;
      top: 33px;
      width: 500px;
      z-index: -1;
    }
  
    .process-modell li:nth-child(11)::after {
      /* background: #e5e5e5 none repeat scroll 0 0; */
      /* border-top: 4px dotted #e5e5e5; */
      bottom: 0;
      content: "";
      display: block;
      height: 154px;
      margin: 0 auto;
      position: absolute;
      right: -214px;
      top: 33px;
      width: 500px;
      z-index: -1;
    }
  
    .process-modell li:nth-child(12)::after {
      /* background: #e5e5e5 none repeat scroll 0 0; */
      /* border-top: 4px dotted #e5e5e5; */
      bottom: 0;
      content: "";
      display: block;
      height: 154px;
      margin: 0 auto;
      position: absolute;
      right: -214px;
      top: 33px;
      width: 500px;
      z-index: -1;
    }
  
    .process-modell li:nth-child(4).visited::after {
      /* background: #29602e; */
      /* border-top: 5px dotted #ffffff; */
      background: url(../img/line_group_hover.svg);
      background-position: top 0px left 217px;
      background-repeat: no-repeat;
      background-size: 49%;
      -webkit-transition: width 0.3s linear;
      transition: width 0.3s linear;
    }
    .process-modell li:nth-child(8).visited::after {
      /* background: #29602e; */
      /* border-top: 5px dotted #ffffff; */
      background: url(../img/line_group_hover.svg);
      background-position: top 0px left 217px;
      background-repeat: no-repeat;
      background-size: 49%;
      -webkit-transition: width 0.3s linear;
      transition: width 0.3s linear;
    }
  
    .process-modell li:nth-child(11).visited::after {
      /* background: #29602e; */
      /* border-top: 5px dotted #ffffff; */
      background: url(../img/11_step.svg);
      background-position: top 0px left 189px;
      background-repeat: no-repeat;
      background-size: 41%;
      -webkit-transition: width 0.3s linear;
      transition: width 0.3s linear;
    }
  
    .process-modell li:nth-child(12).visited::after {
      /* background: #29602e; */
      /* border-top: 5px dotted #ffffff; */
      background: url(../img/line_group_hover_last.svg);
      background-position: top 0px left 217px;
      background-repeat: no-repeat;
      background-size: 49%;
      -webkit-transition: width 0.3s linear;
      transition: width 0.3s linear;
    }
  }
  
  .brd {
    /* height: 12vh; */
    background-color: #f9f9f9;
    margin-top: 0rem;
    margin-bottom: 1rem;
  }
  .brdcrmb {
    margin-right: auto;
  }
  .breadcrumb {
    display: flex;
    flex-wrap: wrap;
    padding: 0 0;
    margin-bottom: 1rem;
    list-style: none;
    background-color: transparent;
    border-radius: 0;
  }
  .breadcrumb-item {
    display: flex;
    color: #60697b;
  }
  .breadcrumb-item + .breadcrumb-item {
    padding-left: 0.6rem;
  }
  
  .container,
  .container-fluid,
  .container-lg,
  .container-md,
  .container-sm,
  .container-xl,
  .container-xxl {
    width: 100%;
    padding-right: var(--bs-gutter-x, 1.5rem);
    padding-left: var(--bs-gutter-x, 1.5rem);
    margin-right: auto;
    margin-left: auto;
  }
  
  .navbar > .container,
  .navbar > .container-fluid,
  .navbar > .container-lg,
  .navbar > .container-md,
  .navbar > .container-sm,
  .navbar > .container-xl,
  .navbar > .container-xxl {
    display: flex;
    flex-wrap: inherit;
    align-items: center;
    justify-content: space-between;
  }
  
  .body_wrapper {
    background-color: #f9f9f9;
    min-height: 100%;
  }
  
  .icon-plane {
    transform: rotate(-145deg);
  }