/* Adapted from the user-supplied Allianz HTML5 template service components. */
.service-item {
  --item-bg: var(--color-white);
  --item-bg-hover: var(--color-white);
  --item-margin-bottom: var(--bs-gutter-x);
  --item-border-radius: 5px;
  --title-font-size: 22px;
  --desc-font-size: 15px;
  --icon-font-size: 48px;
  --icon-color: var(--color-primary);
  --title-color: var(--color-secondary);
  --desc-color: var(--bs-gray);
  --title-margin-bottom: 21px;
  --desc-margin-bottom: 35px;
  --icon-margin: 0 0 32px;
  --service-body-padding: 50px;
  --icon-animation: bounce 1s linear infinite;
  --box-shadow: 0 5px 43px 0 rgba(27, 26, 26, 0.06);
  --box-shadow-hover: 0 5px 43px 0 rgba(27, 26, 26, 0.1);
  position: relative;
  border-radius: var(--item-border-radius);
  box-shadow: var(--box-shadow);
  background-color: var(--item-bg);
  margin-bottom: var(--item-margin-bottom);
  transition: all 0.4s ease;
}
.service-item:hover {
  box-shadow: var(--box-shadow-hover);
  background-color: var(--item-bg-hover);
}
.service-item .service-body {
  position: relative;
  z-index: 2;
  padding: var(--service-body-padding);
}
.service-item .service-icon {
  position: relative;
  line-height: 1;
  color: var(--icon-color);
  font-size: var(--icon-font-size);
  margin: var(--icon-margin);
}
.service-item .service-title {
  font-size: var(--title-font-size);
  margin-bottom: var(--title-margin-bottom);
}
.service-item .service-title a {
  color: var(--title-color);
}
.service-item .service-desc {
  color: var(--desc-color);
  font-size: var(--desc-font-size);
  margin-bottom: var(--desc-margin-bottom);
}
.service-item .service-icon,
.service-item .service-title,
.service-item .service-desc,
.service-item .service-img img {
  transition: all 0.3s linear;
}