.elementor-113015 .elementor-element.elementor-element-19c90b5{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-113015 .elementor-element.elementor-element-c39ea67{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}/* Start custom CSS for container, class: .elementor-element-19c90b5 *//* =========================================
   CUSTOMER COMMUNICATION LIFECYCLE
   ========================================= */

section.ccl-section {
  width: 100% !important;
  padding: 0 !important;
  margin: 0 0 24px 0 !important;
  box-sizing: border-box !important;
}

/* =========================================
   OUTER
   ========================================= */

div.ccl-outer {
  width: 100% !important;
  margin: 0 auto !important;
  padding: 6px !important;
  box-sizing: border-box !important;
  border: 1px solid #3d4242 !important;
  background: #ffffff !important;
}

/* =========================================
   INNER
   ========================================= */

div.ccl-inner {
  width: 100% !important;
  position: relative !important;
  margin: 0 auto !important;
  padding: 78px 24px 48px 24px !important;
  box-sizing: border-box !important;
  border: 1px solid #acacac !important;
  background: #ffffff !important;
}

/* =========================================
   LOGO
   ========================================= */

img.ccl-logo {
  position: absolute !important;
  top: 20px !important;
  right: 20px !important;

  width: 160px !important;
  height: auto !important;

  display: block !important;

  margin: 0 !important;
  padding: 0 !important;

  border: 0 !important;
  border-radius: 0 !important;

  object-fit: contain !important;
}

/* =========================================
   MAIN TITLE
   ========================================= */

p.ccl-title {
  width: 100% !important;

  margin: 0 !important;
  padding: 0 !important;

  color: #3d4242 !important;

  font-size: 32px !important;
  line-height: 40px !important;

  font-weight: 700 !important;

  text-align: left !important;

  box-sizing: border-box !important;
}

p.ccl-title span {
  color: #00c19d !important;

  font-size: 32px !important;
  line-height: 40px !important;

  font-weight: 700 !important;

  padding: 0 !important;
}

/* =========================================
   SUBTITLE
   ========================================= */

p.ccl-subtitle {
  width: 100% !important;

  margin: 0 !important;
  padding: 0 !important;

  color: #3d4242 !important;

  font-size: 18px !important;
  line-height: 26px !important;

  font-weight: 500 !important;

  text-align: left !important;

  box-sizing: border-box !important;
}

/* =========================================
   LIFECYCLE CONTAINER
   ========================================= */

div.ccl-lifecycle {
  width: 100% !important;

  display: grid !important;

  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;

  column-gap: 0 !important;

  margin: 54px 0 0 0 !important;
  padding: 0 !important;

  box-sizing: border-box !important;

  align-items: start !important;
}

/* =========================================
   STAGE
   ========================================= */

div.ccl-stage {
  width: 100% !important;

  min-width: 0 !important;

  margin: 0 !important;
  padding: 0 12px !important;

  box-sizing: border-box !important;

  position: relative !important;

  text-align: center !important;
}

/* =========================================
   STAGE NUMBER
   ========================================= */

p.ccl-stage-number {
  width: 100% !important;

  margin: 0 0 38px 0 !important;
  padding: 0 !important;

  color: #87969b !important;

  font-size: 12px !important;
  line-height: 16px !important;

  font-weight: 700 !important;

  text-align: center !important;

  box-sizing: border-box !important;
}

/* =========================================
   ACTIVE STAGE NUMBER
   ========================================= */

div.ccl-stage.ccl-active p.ccl-stage-number {
  color: #00c19d !important;
}

/* =========================================
   ICON ROW
   ========================================= */

div.ccl-icon-row {
  width: 100% !important;

  height: 80px !important;

  display: flex !important;

  align-items: center !important;

  position: relative !important;

  margin: 0 !important;
  padding: 0 !important;

  box-sizing: border-box !important;
}

/* =========================================
   ICON CIRCLE - OUTER BORDER
   ========================================= */

div.ccl-icon-circle {
  width: 78px !important;
  min-width: 78px !important;
  height: 78px !important;

  margin: 0 auto !important;
  padding: 0 !important;

  display: flex !important;

  align-items: center !important;
  justify-content: center !important;

  box-sizing: border-box !important;

  border: 1.5px solid #3d4242 !important;

  border-radius: 50% !important;

  background: #ffffff !important;

  position: relative !important;

  z-index: 3 !important;

  transition: border-color 0.25s ease !important;
  transition: background-color 0.25s ease !important;
}

/* =========================================
   INNER GREEN CIRCLE
   5PX SPACE FROM OUTER BORDER
   ========================================= */

div.ccl-icon-circle::before {
  content: "" !important;

  position: absolute !important;

  width: 66px !important;
  height: 66px !important;

  top: 50% !important;
  left: 50% !important;

  transform: translate(-50%, -50%) !important;

  border-radius: 50% !important;

  background: transparent !important;

  z-index: 1 !important;

  transition: background-color 0.25s ease !important;
}

/* =========================================
   ICON
   ========================================= */

div.ccl-icon-circle img {
  width: 34px !important;
  height: 34px !important;

  display: block !important;

  margin: 0 !important;
  padding: 0 !important;

  object-fit: contain !important;

  border: 0 !important;
  border-radius: 0 !important;

  filter: none !important;

  position: relative !important;

  z-index: 2 !important;

  transition: filter 0.25s ease !important;
}

/* =========================================
   HOVER - OUTER BORDER
   ========================================= */

div.ccl-stage:hover div.ccl-icon-circle {
  background: #ffffff !important;
  border-color: #00c19d !important;
}

/* =========================================
   HOVER - INNER CIRCLE
   ========================================= */

div.ccl-stage:hover div.ccl-icon-circle::before {
  background: #00c19d !important;
}

/* =========================================
   HOVER - WHITE ICON
   ========================================= */

div.ccl-stage:hover div.ccl-icon-circle img {
  filter: brightness(0) invert(1) !important;
}

/* =========================================
   ACTIVE - OUTER BORDER
   ========================================= */

div.ccl-stage.ccl-active div.ccl-icon-circle {
  background: #ffffff !important;
  border-color: #00c19d !important;
}

/* =========================================
   ACTIVE - INNER CIRCLE
   ========================================= */

div.ccl-stage.ccl-active div.ccl-icon-circle::before {
  background: #00c19d !important;
}

/* =========================================
   ACTIVE - WHITE ICON
   ========================================= */

div.ccl-stage.ccl-active div.ccl-icon-circle img {
  filter: brightness(0) invert(1) !important;
}

/* =========================================
   CONNECTOR
   ========================================= */

div.ccl-connector {
  position: absolute !important;

  top: 50% !important;
  right: -2px !important;

  transform: translateY(-50%) !important;

  width: calc(50% - 39px) !important;

  height: 1px !important;

  background: #00c19d !important;

  margin: 0 !important;
  padding: 0 !important;

  z-index: 1 !important;
}

/* =========================================
   CONNECTOR POSITION
   ========================================= */

div.ccl-stage:not(.ccl-last-stage) div.ccl-icon-row::after {
  content: "" !important;

  position: absolute !important;

  top: 50% !important;
  left: calc(50% + 45%) !important;

  transform: translateY(-50%) !important;

  width: calc(50% - 39px) !important;

  height: 1px !important;

  background: #00c19d !important;

  z-index: 1 !important;
}

/* =========================================
   HIDE EXTRA CONNECTOR
   ========================================= */

div.ccl-stage:not(.ccl-last-stage) div.ccl-connector {
  display: none !important;
}

/* =========================================
   STAGE TITLE
   ========================================= */

p.ccl-stage-title {
  width: 100% !important;

  margin: 37px 0 0 0 !important;
  padding: 0 !important;

  color: #3d4242 !important;

  font-size: 18px !important;
  line-height: 23px !important;

  font-weight: 700 !important;

  text-align: center !important;

  box-sizing: border-box !important;
}

/* =========================================
   STAGE DESCRIPTION
   ========================================= */

p.ccl-stage-description {
  width: 100% !important;

  margin: 38px 0 0 0 !important;
  padding: 0 !important;

  color: #3d4242 !important;

  font-size: 17px !important;
  line-height: 22px !important;

  font-weight: 500 !important;

  text-align: center !important;

  box-sizing: border-box !important;
}

/* =========================================
   LAST STAGE
   ========================================= */

div.ccl-last-stage {
  padding-right: 0 !important;
}

/* =========================================
   ELEMENTOR / WORDPRESS RESET
   ========================================= */

section.ccl-section p,
section.ccl-section img,
section.ccl-section div {
  box-sizing: border-box !important;
}

/* =========================================
   MOBILE
   ========================================= */

@media (max-width: 767px) {
  section.ccl-section {
    margin-bottom: 18px !important;
  }

  div.ccl-outer {
    padding: 5px !important;
  }

  div.ccl-inner {
    padding: 70px 12px 30px 12px !important;
  }

  img.ccl-logo {
    width: 90px !important;

    top: 16px !important;
    right: 15px !important;
  }

  p.ccl-title {
    font-size: 22px !important;
    line-height: 29px !important;
  }

  p.ccl-title span {
    font-size: 22px !important;
    line-height: 29px !important;
  }

  p.ccl-subtitle {
    font-size: 14px !important;
    line-height: 21px !important;

    margin-top: 5px !important;
  }

  div.ccl-lifecycle {
    grid-template-columns: 1fr !important;

    row-gap: 35px !important;

    margin-top: 40px !important;
  }

  div.ccl-stage {
    padding: 0 !important;
  }

  p.ccl-stage-number {
    margin-bottom: 20px !important;

    font-size: 11px !important;
    line-height: 15px !important;
  }

  div.ccl-icon-row {
    height: 72px !important;
  }

  /* MOBILE OUTER CIRCLE */

  div.ccl-icon-circle {
    width: 72px !important;
    min-width: 72px !important;
    height: 72px !important;

    border-width: 1.5px !important;
  }

  /* MOBILE INNER CIRCLE
     5PX GAP */

  div.ccl-icon-circle::before {
    width: 60px !important;
    height: 60px !important;
  }

  div.ccl-icon-circle img {
    width: 30px !important;
    height: 30px !important;
  }

  div.ccl-stage:not(.ccl-last-stage) div.ccl-icon-row::after {
    display: none !important;
  }

  p.ccl-stage-title {
    margin-top: 24px !important;

    font-size: 16px !important;
    line-height: 21px !important;
  }

  p.ccl-stage-description {
    margin-top: 16px !important;

    padding: 0 20px !important;

    font-size: 14px !important;
    line-height: 21px !important;
  }
}

/* =========================================
   TABLET
   ========================================= */

@media (min-width: 768px) and (max-width: 1024px) {
  div.ccl-inner {
    padding: 65px 18px 40px 18px !important;
  }

  img.ccl-logo {
    width: 125px !important;

    top: 18px !important;
    right: 18px !important;
  }

  p.ccl-title {
    font-size: 28px !important;
    line-height: 36px !important;
  }

  p.ccl-title span {
    font-size: 28px !important;
    line-height: 36px !important;
  }

  p.ccl-subtitle {
    font-size: 16px !important;
    line-height: 24px !important;
  }

  div.ccl-lifecycle {
    margin-top: 45px !important;
  }

  div.ccl-stage {
    padding: 0 6px !important;
  }

  p.ccl-stage-number {
    font-size: 11px !important;
    line-height: 15px !important;
  }

  /* TABLET OUTER CIRCLE */

  div.ccl-icon-circle {
    width: 68px !important;
    min-width: 68px !important;
    height: 68px !important;

    border-width: 1.5px !important;
  }

  /* TABLET INNER CIRCLE
     5PX GAP */

  div.ccl-icon-circle::before {
    width: 56px !important;
    height: 56px !important;
  }

  div.ccl-icon-circle img {
    width: 30px !important;
    height: 30px !important;
  }

  p.ccl-stage-title {
    margin-top: 32px !important;

    font-size: 16px !important;
    line-height: 21px !important;
  }

  p.ccl-stage-description {
    margin-top: 28px !important;

    font-size: 14px !important;
    line-height: 20px !important;
  }
}/* End custom CSS */