.jh-solid-box {background-color: #EEEEEE; border-radius: 15px; margin: 1em 0; padding:30px; min-height:0px; display:block; box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);}

.jh-solid-box2 {background-color: #FFFFFF; border-radius: 15px; margin: 1em 0; padding:30px; min-height:0px; display:block; box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);}

@media only screen and (min-width: 800px) {
  .d0splitbackground {
    position: relative;
  }

  .d0splitbackground::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: linear-gradient(
      to left,
      rgba(3, 150, 183, 0) 0%,
      rgba(3, 150, 183, 0) 50%,
      rgba(3, 150, 183, 1) 50%,
      rgba(3, 150, 183, 1) 100%
    );
    pointer-events: none;
  }
}

@media only screen and (max-width: 799px) {
.parallax03 {background-position-x: right;}
.d0splitbackground {background:#0396B7;}}

/* 1. White Box - Default State */
.jh-hover-box {
  background-color: #FFFFFF !important; 
  border: solid 1px #EEEEEE !important; 
  border-radius: 15px !important;
  padding: 30px !important; 
  min-height: 200px !important; 
  display: block !important;
  margin-bottom: 20px !important;
  text-decoration: none !important;
  color: inherit !important;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05) !important;
  transition: all 0.35s ease-in-out !important;
}

/* 1. White Box - Hover State */
.jh-hover-box:hover { 
  transform: scale(1.03) !important; 
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15) !important; 
}

/* 2. Gray Box - Default State */
.jh-hover-box2 {
  background-color: #F6F6F6 !important; 
  border: solid 1px #EEEEEE !important; 
  border-radius: 15px !important;
  padding: 30px !important; 
  min-height: 160px !important; 
  display: block !important;
  margin-bottom: 20px !important;
  text-decoration: none !important;
  color: inherit !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
  transition: all 0.35s ease-in-out !important;
}

/* 2. Gray Box - Hover State */
.jh-hover-box2:hover { 
  transform: scale(1.03) !important; 
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.18) !important; 
}

@media only screen and (min-width: 800px) {.d0fivecolumnwrapper {display: flex; overflow: hidden; width: 100%;}} @media only screen and (max-width: 799px) {.d0fivecolumnwrapper {display: flex; flex-direction: column; overflow: hidden; width: 100%;}} .d0fivecolumn {flex: 1 1 20%; box-sizing: border-box; padding: 0 5px;}

.rich-box1 {padding:30px; min-height:180px; display:block; 
background:     linear-gradient(rgba(8, 45, 85, 0.50), rgba(8, 45, 85, 0.50)), url(/shared/images/content/bus_58381/anaphylaxis-courses-01.jpg?nocache=722) ;
  background-repeat: no-repeat;
  background-position: center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; border-radius: 15px;   transition: transform 0.25s ease, box-shadow 0.25s ease; align-items: center;
justify-content: center;}
.rich-box1:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.20);
}

.rich-box2 {padding:30px; min-height:180px; display:block; 
background:     linear-gradient(rgba(8, 45, 85, 0.50), rgba(8, 45, 85, 0.50)), url(/shared/images/content/bus_58381/education-training-courses.jpg?nocache=265) ;
  background-repeat: no-repeat;
  background-position: center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; border-radius: 15px;   transition: transform 0.25s ease, box-shadow 0.25s ease; align-items: center;
justify-content: center;}
.rich-box2:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.20);
}

.rich-box3 {padding:30px; min-height:180px; display:block; 
background:     linear-gradient(rgba(8, 45, 85, 0.50), rgba(8, 45, 85, 0.50)), url(/shared/images/content/bus_58381/first-aid-courses-01.jpg?nocache=482) ;
  background-repeat: no-repeat;
  background-position: center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; border-radius: 15px;   transition: transform 0.25s ease, box-shadow 0.25s ease; align-items: center;
justify-content: center;}
.rich-box3:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.20);
}

.rich-box4 {padding:30px; min-height:180px; display:block; 
background:    linear-gradient(rgba(8, 45, 85, 0.50), rgba(8, 45, 85, 0.50)), url(/shared/images/content/bus_58381/basic-lift-support-courses.jpg?nocache=411) ;
  background-repeat: no-repeat;
  background-position: center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; border-radius: 15px;   transition: transform 0.25s ease, box-shadow 0.25s ease; align-items: center;
justify-content: center;}
.rich-box4:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.20);
}

.rich-box5 {padding:30px; min-height:180px; display:block; 
background:    linear-gradient(rgba(8, 45, 85, 0.50), rgba(8, 45, 85, 0.50)), url(/shared/images/content/bus_58381/manual-handling-courses-01.jpg?nocache=52) ;
  background-repeat: no-repeat;
  background-position: center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; border-radius: 15px;
transition: transform 0.25s ease, box-shadow 0.25s ease;
align-items: center;
justify-content: center;}
.rich-box5:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.20);
}

.rich-box1 p {
  margin: 0;
}
.rich-box2 p {
  margin: 0;
}
.rich-box3 p {
  margin: 0;
}
.rich-box4 p {
  margin: 0;
}
.rich-box5 p {
  margin: 0;
}