/* Section styles */
.important-functions {
  background: #fbfbfb;
  padding: 20px 0 10px;
}

/* Grid Adjustments */
.important-functions > .row.wide {
  max-width: 1200px;
}

/* Slick Slider Adjustments */

.important-functions .slick-custom-slider-container[data-slick-id="importantFunctions"] .slick-track {
  margin: 0 auto;
}

.important-functions .row .slick-custom-slider-container .slick-dots li button:before {
  color: #585858;
}

.important-functions .slick-custom-slider-container[data-slick-id="importantFunctions"] .slick-arrow:not(.slick-disabled):before {
  color: #780235;
  opacity: 1;
}

.important-functions .slick-custom-slider-container[data-slick-id="importantFunctions"] .slick-arrow.slick-disabled {
  pointer-events: none;
}

.important-functions .slick-custom-slider-container[data-slick-id="importantFunctions"] .slick-prev,
.important-functions .slick-custom-slider-container[data-slick-id="importantFunctions"] .slick-next {
  top: 37.25%;
  transform: none;
}

.important-functions .slick-custom-slider-container[data-slick-id="importantFunctions"] .slick-prev.slick-disabled:hover:before, 
.important-functions .slick-custom-slider-container[data-slick-id="importantFunctions"] .slick-next.slick-disabled:hover:before {
  opacity: .15;
}

/* Phone slide styles */
.important-functions .laptop-wrapper {
  margin: 0 auto 20px;
  max-width: 590px;
}

.important-functions .laptop-wrapper .laptop-screen-wrapper {
  max-width: 480px;
  margin: 0 9%;
}

.important-functions .laptop-wrapper .laptop-screen-wrapper .laptop-screen-body {
  border-top-left-radius: 23px;
  border-top-right-radius: 23px;
  border: 1px solid #2e2e2e;
  border-bottom: none;
  padding: 0 3% 4%;
  text-align: center;
}

.important-functions .laptop-wrapper .laptop-screen-wrapper .laptop-screen-body .laptop-camera {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: 1px solid #2e2e2e;
}

.important-functions .laptop-wrapper .laptop-screen-wrapper .laptop-screen-body .laptop-screen {
  width: 100%;
  height: 0;
  padding-bottom: 56.25%;
  border: 1px solid #2e2e2e;
  overflow: hidden;
}

.important-functions .laptop-wrapper .laptop-bottom-front-case {
  height: 10px;
  width: 100%;
  max-width: 590px;
  border: 1px solid #2e2e2e;
  margin: 0 auto;
  transform-origin: center center;
}

.important-functions .laptop-wrapper .laptop-bottom-front-case .case-emboss {
  display: block;
  margin: 0 auto;
  width: 15%;
  height: 60%;
  border-bottom-left-radius: 20px;
  border-bottom-right-radius: 20px;
  border: 1px solid #2e2e2e;
  border-top: none;
}

.important-functions .laptop-wrapper .laptop-bottom-bottom-case {
  height: 7px;
  width: 100%;
  max-width: 590px;
  border: 1px solid #2e2e2e;
  margin: 0 auto;
  transform-origin: center center;
  border-radius: 20px/7px;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  border-top: none;
}

.important-functions .laptop-wrapper .phone-model img {
  width: 100%;
}

.important-functions [data-slick-id="importantFunctions"] .important-functions-single-step .text-limiter {
  width: 60%;
  margin: 0 auto;
}

.important-functions [data-slick-id="importantFunctions"] .important-functions-single-step .text-limiter .slide-title {
  font-size: 1.125rem;
  font-weight: 600;
}
  
.important-functions [data-slick-id="importantFunctions"] .important-functions-single-step .text-limiter .slide-content {
  font-size: 1rem; /* 16/16 */
  font-weight: 400;
}

/* ----------- MEDIA QUERIES ---------- */

/* Section styles */
@media only screen and (min-width: 48em) { /* 768/16 */
  .important-functions {
    padding: 30px 0 10px;
  }
}

@media only screen and (min-width: 64em) { /* 1024/16 */
  .important-functions {
    padding: 60px 0 40px;
  }
}

@media only screen and (min-width: 40em) {
  .important-functions .important-functions-title {
    font-size: 40px;
    margin-bottom: 35px;
  }
}

/* Slick Slider Adjustments */
@media only screen and (max-width: 64em) {
  .important-functions .row .slick-custom-slider-container .slick-list {
    padding-bottom: 40px;
  }
}
@media only screen and (min-width: 40em) {
  .important-functions .row .slick-custom-slider-container .slick-list {
    margin: 0 70px;
  }
}

/* Phone slide styles */
@media screen and (min-width: 64em) { /* 1024/16 */
  .important-functions .laptop-wrapper {
    margin: 0 auto 30px;
  }
}