

/*---Numbers---*/


/*---Step Layout---*/
@media only screen and (min-width: 1024px) {
.row {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    margin-right: -16px;
    margin-left: -16px;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    flex-direction: row-reverse;
}
/*.row.mx-n12 {
    margin-right: -12px;
    margin-left: -12px;
}
.row.mx-n12.journal-post-grid {
    overflow: hidden;
}*/
.col {
    width: 50%;
    max-width: 100%;
   
}

.steps-wrapper {
    padding-top: 300px;
    padding-bottom: 300px;
}




.steps-images {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 100vh;
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 0;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}
.step {
    padding: 150px 60px;
    opacity: 0.15;
    list-style: none;
}

.steps-images-inner {
    position: relative;
    width: 100%;
    padding-right: 85px;
    padding-left: 85px;
}

.step-image {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 1;
    opacity: 0;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.step-image{
    position: absolute;
    width: 80%;
    height: auto;
}
  
  .step-image img{
   width: 100%;
    height:auto;
  }

.step h4{
  font-family: 'Kepler Std';
  font-style: italic;
  font-weight: 300;
  font-size: 18px;
  line-height: 100%;
  margin-top:12px;
  margin-bottom: 40px;
}

  .steps-highlight.mobile {display:none;}
}

@media only screen and (max-width: 1024px) {
  .steps-highlight.desktop {display:none;}
  .steps-highlight.mobile {display:block; max-width: 100%;}
  .steps-images-inner{padding:0;}
  .step{padding:0; list-style: none;}
  .step-image img{max-width:100%; width:100%; height:auto;margin-bottom: 20px;}
  
  
}
