FM / sass

/home/techb158/l2hypotheques.com/wp-content/themes/pylon/assets/sass/

/home/techb158/l2hypotheques.com/wp-content/themes/pylon/assets/sass

Name	Size	Mode	Actions
utility/	-	0755	rm
variables/	-	0755	rm
main.scss	5786	0644	edit dl rm
_about.scss	9014	0644	edit dl rm
_animations.scss	1831	0644	edit dl rm
_blog-details.scss	3298	0644	edit dl rm
_blog-sidebar.scss	1989	0644	edit dl rm
_call-to-action.scss	1441	0644	edit dl rm
_client-carousel.scss	468	0644	edit dl rm
_common.scss	6117	0644	edit dl rm
_contact.scss	2527	0644	edit dl rm
_credit-card.scss	2046	0644	edit dl rm
_faq.scss	2978	0644	edit dl rm
_features.scss	7038	0644	edit dl rm
_footer.scss	4469	0644	edit dl rm
_forms.scss	1114	0644	edit dl rm
_fun-fact.scss	1859	0644	edit dl rm
_google-map.scss	187	0644	edit dl rm
_how-works.scss	779	0644	edit dl rm
_mobile-nav.scss	4207	0644	edit dl rm
_navigation.scss	7786	0644	edit dl rm
_page-header.scss	1169	0644	edit dl rm
_search-popup.scss	1424	0644	edit dl rm
_services.scss	10854	0644	edit dl rm
_slider.scss	4486	0644	edit dl rm
_team.scss	6282	0644	edit dl rm
_testimonials.scss	2274	0644	edit dl rm
_trusted-company.scss	2450	0644	edit dl rm
_video.scss	2708	0644	edit dl rm
_why-choose.scss	3503	0644	edit dl rm

Edit: /home/techb158/l2hypotheques.com/wp-content/themes/pylon/assets/sass/_faq.scss (2978B)

.faq-one {
  background-color: #0c2139;
  position: relative;
  padding: 120px 0;
  padding-top: 364px;
  &__bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0.02;
    background-size: cover;
  }
  &__content {
    padding-right: 41px;
    @media (max-width: 1199px) {
      padding-right: 0;
    }
    @media (max-width: 991px) {
      margin-bottom: 40px;
    }
  }
  .block-title {
    max-width: 520px;
    p {
      color: $thm-text-dark;
    }
    h2 {
      font-weight: 400;
      color: #fff;
      letter-spacing: -0.01em;
    }
  }
  #accordion {
    li {
      border-radius: $border-radius;
    }
    li + li {
      margin-top: 20px;
    }
    .para-title {
      position: relative;
      color: $thm-black;
      font-size: 18px;
      font-weight: 500;
      line-height: 1.3;
      cursor: pointer;
      margin-bottom: 0;
      padding: 24.5px 40px;
      background-color: #fff;
      border-radius: $border-radius;
      @media (max-width: 480px) {
        padding-left: 25px;
        padding-right: 25px;
      }
      span {
        display: block;
        transition: all 500ms ease;
      }
      &.active {
        color: $thm-base;
        i {
          color: $thm-base;
        }
      }
      i {
        font-size: 16px;
        color: $thm-black;
        transition: all 500ms ease;
        position: absolute;
        top: 50%;
        right: 40px;
        transform: translateY(-50%);
        @media (max-width: 480px) {
          right: 25px;
        }
      }
    }
    .collapse {
      transition: all 500ms ease;
    }
    p {
      transition: all 500ms ease;
      background-color: #fff;
      margin: 0;
      padding: 0 40px;
      padding-bottom: 30px;
      border-bottom-left-radius: $border-radius;
      border-bottom-right-radius: $border-radius;
      @media (max-width: 480px) {
        padding-left: 25px;
        padding-right: 25px;
      }
    }
  }
}

.faq-one__faq-page {
  background-color: #fff;
  padding-top: 120px;
  #accordion li {
    background-color: #eff2f6;
    border-radius: $border-radius;
    transition: all 500ms ease;
    &.active {
      background-color: #fff;
      box-shadow: 0px 10px 60px 0px rgba(0, 0, 0, 0.1);
    }
    .para-title {
      background-color: #eff2f6;
      &.active {
        background-color: #fff;
      }
    }
    .collapse {
      background-color: #eff2f6;
    }
  }
}

.faq-one__box {
  background-color: $thm-primary;
  border-radius: $border-radius;
  @media (max-width: 991px) {
    margin-top: 60px;
  }
  img {
    width: 100%;
  }
  .main-header__info-phone {
    justify-content: center;
    align-items: center;
    padding: 32px 0;
  }
  .main-header__info-phone-content span {
    color: $thm-text-dark;
  }
  .main-header__info-phone-content h3 {
    color: #fff;
  }
}

.faq-one { background-color: #0c2139; position: relative; padding: 120px 0; padding-top: 364px; &__bg { position: absolute; top: 0; left: 0; right: 0; bottom: 0; opacity: 0.02; background-size: cover; } &__content { padding-right: 41px; @media (max-width: 1199px) { padding-right: 0; } @media (max-width: 991px) { margin-bottom: 40px; } } .block-title { max-width: 520px; p { color: $thm-text-dark; } h2 { font-weight: 400; color: #fff; letter-spacing: -0.01em; } } #accordion { li { border-radius: $border-radius; } li + li { margin-top: 20px; } .para-title { position: relative; color: $thm-black; font-size: 18px; font-weight: 500; line-height: 1.3; cursor: pointer; margin-bottom: 0; padding: 24.5px 40px; background-color: #fff; border-radius: $border-radius; @media (max-width: 480px) { padding-left: 25px; padding-right: 25px; } span { display: block; transition: all 500ms ease; } &.active { color: $thm-base; i { color: $thm-base; } } i { font-size: 16px; color: $thm-black; transition: all 500ms ease; position: absolute; top: 50%; right: 40px; transform: translateY(-50%); @media (max-width: 480px) { right: 25px; } } } .collapse { transition: all 500ms ease; } p { transition: all 500ms ease; background-color: #fff; margin: 0; padding: 0 40px; padding-bottom: 30px; border-bottom-left-radius: $border-radius; border-bottom-right-radius: $border-radius; @media (max-width: 480px) { padding-left: 25px; padding-right: 25px; } } } } .faq-one__faq-page { background-color: #fff; padding-top: 120px; #accordion li { background-color: #eff2f6; border-radius: $border-radius; transition: all 500ms ease; &.active { background-color: #fff; box-shadow: 0px 10px 60px 0px rgba(0, 0, 0, 0.1); } .para-title { background-color: #eff2f6; &.active { background-color: #fff; } } .collapse { background-color: #eff2f6; } } } .faq-one__box { background-color: $thm-primary; border-radius: $border-radius; @media (max-width: 991px) { margin-top: 60px; } img { width: 100%; } .main-header__info-phone { justify-content: center; align-items: center; padding: 32px 0; } .main-header__info-phone-content span { color: $thm-text-dark; } .main-header__info-phone-content h3 { color: #fff; } }