/* 
------------------
Template Name: AppName | App Landing Page Template
Author: Developer Zahid
Author Website: https://developer-zahid-portfolio.netlify.app
Author Email: coderexpertzahid@gmail.com
Version: 1.00
------------------

----------------
Table of CSS Content
----------------

1.Google Fonts Link
2.Custom Icons Link
3.Typography Reset
4.Reset CSS
5.Custom Container Style
6.Veno Box Style
7.Preloader Section Style
8.Common Section Gap Style
9.Common Section Heading Style
10.Common Color's Style
11.Common Transition Style
12.Common Button's Style
13.Accordion's Style
14.Form's Section Style
15.Header Section Style
16.Parallax Banner Section Style
17.Banner Section Style
18.Sub Banner Section Style
19.About Section Style
20.Feature Section Style
21.Community Section Style
22.Pricing Section Style
23.F.A.Q. Section Style
24.Get Started Section Style
25.Login Section Style
26.Blog Section Style
27.Blog Details Section Style
28.Footer Section Style

------------------
*/
/* Google Fonts Link */
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap");
/* Custom Icons Link */
@import url("../fonts/appname-icon/style.css");
/* Typography Reset */
h1,
.h1,
h2,
.h2,
h3,
.h3,
h4,
.h4,
h5,
.h5,
h6,
.h6 {
  font-family: "Poppins", sans-serif;
}

h1,
.h1 {
  font-size: 2.25rem;
}

h2,
.h2 {
  font-size: 1.875rem;
}

h3,
.h3 {
  font-size: 1.5rem;
}

h4,
.h4 {
  font-size: 1.125rem;
}

h5,
.h5 {
  font-size: 0.75rem;
}

p {
  font-size: 1rem;
  line-height: 1.75rem;
}

/* Reset CSS */
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  outline: none;
  -webkit-tap-highlight-color: transparent;
}

::-moz-selection {
  color: #f5f7fa;
  background: #817aff;
}

::selection {
  color: #f5f7fa;
  background: #817aff;
}

html,
body {
  scroll-behavior: smooth;
}

html {
  font-size: 16px;
  -webkit-text-size-adjust: none;
  -moz-text-size-adjust: none;
  -ms-text-size-adjust: none;
  text-size-adjust: none;
  scrollbar-width: thin;
  scrollbar-color: #817aff #ffffff;
}

html::-webkit-scrollbar {
  width: 8px;
}

html::-webkit-scrollbar-thumb {
  background-color: #817aff;
}

html::-webkit-scrollbar-track {
  background-color: #ffffff;
}

body {
  color: #686666;
  font-weight: 400;
  font-family: "Poppins", sans-serif;
}

a,
a:hover,
a:focus,
a:active {
  text-decoration: none;
  color: unset;
}

button,
button:hover,
button:focus,
button:active {
  outline: none;
}

input:-webkit-autofill {
  -webkit-text-fill-color: unset;
  -webkit-transition: background-color 5000s;
  -o-transition: background-color 5000s;
  -moz-transition: background-color 5000s;
  transition: background-color 5000s;
}

ul,
ol {
  list-style: none;
}

img {
  -o-object-fit: cover;
  object-fit: cover;
}

.user-select-none {
  pointer-events: none;
}

.list-inline {
  font-size: 0;
}

.list-inline-item {
  font-size: 1rem;
}

/* Custom Container Style */
@media (min-width: 1200px) {
  .container {
    max-width: 1290px;
  }
}

/* Veno Box Style */
.vbox-container {
  scrollbar-width: none;
}

.vbox-container::-webkit-scrollbar {
  width: 0;
}

.vbox-close {
  top: 2%;
  right: 2%;
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  padding: 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -moz-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  font-size: 3rem;
  background: #f55767 !important;
  color: #ffffff !important;
}

.vbox-preloader .sk-child {
  background: #817aff !important;
}

/* Preloader Section Style */
.preloader {
  top: 0;
  left: 0;
  z-index: 9999;
}

/* Common Section Gap Style */
.section-gap {
  padding: 6.25rem 0;
}

@media (max-width: 991px) {
  .section-gap {
    padding: 4.375rem 0;
  }
}

@media (max-width: 767px) {
  .section-gap {
    padding: 3.75rem 0;
  }
}

/* Common Section Heading Style */
.section-header {
  margin-bottom: 1.25rem;
}

.section-header__title {
  font-size: 2.1875rem;
}

@media (max-width: 767px) {
  .section-header__title {
    font-size: 1.875rem;
  }
}

@media (min-width: 992px) {
  .section-header__title {
    line-height: 3.4375rem;
  }
}

/* Common Color's Style */
.primary-color {
  color: #2500f9;
}

.primary-soft-color {
  color: #2563ff;
}

.secondary-color {
  color: #242f51;
}

.danger-color {
  color: #f55767;
}

.success-color {
  color: #40975f;
}

.warning-color {
  color: #ff9966;
}

.rounded-circle {
  padding: 4% 6%;
}

/* Common Transition Style */
.primary-btn,
.secondary-btn,
.slick__arrows,
.tag-btn,
.scroll-top__btn,
.accordion .card .btn__icon::after,
.header,
.header .navbar-toggler,
.header .navbar .nav-item .dropdown-menu,
.header .navbar .nav-item .dropdown-item,
.header .navbar .nav-link,
.blog__card__image,
.blog__card__title__link,
.blog-details__card__title__link,
.footer__block__list__link,
.footer__copyright__link {
  -webkit-transition: all linear 0.3s;
  -o-transition: all linear 0.3s;
  -moz-transition: all linear 0.3s;
  transition: all linear 0.3s;
}

/* Common Button's Style */
.primary-btn,
.secondary-btn {
  font-weight: 600;
}

.primary-btn {
  color: #ffffff;
  background: #2500f9;
  font-size: 1rem;
  padding: 1.03125rem 3.3125rem;
  border-radius: 5px;
}

.primary-btn:hover,
.primary-btn:focus {
  color: #ffffff;
  background: #242f51;
}

.secondary-btn {
  color: #2500f9;
  font-size: 1rem;
  padding: 0.125rem;
}

.secondary-btn:hover,
.secondary-btn:focus {
  color: #2500f9;
  text-decoration: underline;
}

.slick__arrows {
  position: absolute;
  bottom: 0;
  z-index: 3;
  width: 2.5rem;
  height: 2.5rem;
  color: silver;
  background-color: #ffffff;
  font-size: 0.75rem;
  text-align: center;
  cursor: pointer;
}

@media (max-width: 480px) {
  .slick__arrows {
    -webkit-transform: translateY(150%);
    -moz-transform: translateY(150%);
    -ms-transform: translateY(150%);
    -o-transform: translateY(150%);
    transform: translateY(150%);
  }
}

@media (min-width: 481px) {
  .slick__arrows {
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
  }
}

.slick__arrows--left {
  right: 3.25rem;
}

.slick__arrows--right {
  right: 0;
}

.slick__arrows:hover,
.slick__arrows:focus {
  color: #817aff;
  background-color: #e9e9e9;
}

.tag-btn {
  color: #ffffff;
  font-size: 0.875rem;
  padding: 0.625rem 0.9375rem;
}

.tag-btn--pill {
  background-color: #626262;
}

.tag-btn--rounded {
  background-color: #175cff;
  border-radius: 0.3125rem;
}

.tag-btn:hover,
.tag-btn:focus {
  color: #ffffff;
  background-color: #242f51;
}

.scroll-top {
  bottom: 3%;
  right: 1%;
  display: none;
  cursor: pointer;
  z-index: 7;
}

@media (max-width: 575px) {
  .scroll-top {
    bottom: 2%;
  }
}

.scroll-top__btn {
  width: 2.8rem;
  height: 2.8rem;
  font-size: 1.1rem;
  color: #ffffff;
  background: #817aff;
}

.scroll-top__btn:hover,
.scroll-top__btn:focus {
  color: #ffffff;
  background: #2500f9;
}

/* Accordion's Style */
.accordion .card {
  background-color: #f5f7fa;
}

.accordion .card:not(:last-child) {
  margin-bottom: 0.625rem;
}

@media (max-width: 575px) {
  .accordion .card-header {
    padding-left: 0.625rem;
    padding-right: 0.3125rem;
  }
}

.accordion .card .btn {
  font-size: 1.25rem;
  font-weight: 600;
}

@media (max-width: 767px) {
  .accordion .card .btn {
    font-size: 1.125rem;
  }
}

.accordion .card .btn__icon {
  width: 1.125rem;
  height: 3px;
  background-color: #2500f9;
}

.accordion .card .btn__icon::after {
  content: "";
  position: absolute;
  width: 3px;
  height: 1.125rem;
  background-color: inherit;
}

.accordion .card .btn[aria-expanded="true"] .btn__icon::after {
  height: 0;
}

.accordion .card .btn:hover,
.accordion .card .btn:focus {
  color: #242f51;
}

.accordion .card .btn:focus-visible {
  color: #2500f9;
}

.accordion .card-body {
  padding-bottom: 3.75rem;
}

@media (min-width: 992px) {
  .accordion .card-body {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}

/* Form's Section Style */
.form-group {
  margin-bottom: 1.5625rem;
}

@media (min-width: 1401px) {
  .form-group {
    margin-bottom: 1.9375rem;
  }
}

.form__label {
  color: #000000;
}

@media (min-width: 768px) {
  .form__label {
    font-size: 1.125rem;
  }
}

@media (min-width: 1401px) {
  .form__label {
    margin-bottom: 1.5625rem;
  }
}

.form-control {
  border-color: #bbbbbb;
  border-radius: 0.625rem;
  height: 3.125rem;
}

@media (min-width: 1401px) {
  .form-control {
    height: 4.6875rem;
  }
}

.form-control:hover,
.form-control:focus {
  border-color: #2500f9;
}

.form .custom-control-label {
  color: #000000;
  font-size: 1.125rem;
  cursor: pointer;
}

@media (min-width: 768px) {
  .form .custom-control-label {
    padding-left: 1.25rem;
  }
}

@media (min-width: 1401px) {
  .form .custom-control-label {
    padding-left: 1.875rem;
  }
}

.form .custom-control-label::before,
.form .custom-control-label::after {
  top: initial;
}

@media (min-width: 768px) {
  .form .custom-control-label::before,
  .form .custom-control-label::after {
    width: 1.5625rem;
    height: 1.5625rem;
  }
}

@media (min-width: 1401px) {
  .form .custom-control-label::before,
  .form .custom-control-label::after {
    width: 2.1875rem;
    height: 2.1875rem;
  }
}

.form .custom-control-label:hover::before {
  border-color: #2500f9;
}

.form .custom-control-input:focus ~ .custom-control-label::before {
  -webkit-box-shadow: none;
  box-shadow: none;
  border-color: #2500f9;
}

.form .custom-control-input:checked ~ .custom-control-label::before,
.form .custom-control-input:active ~ .custom-control-label::before {
  background-color: #2500f9;
  border-color: #2500f9;
}

.form.was-validated
  .custom-control-input:focus
  ~ .custom-control-label::before {
  -webkit-box-shadow: none;
  box-shadow: none;
  border-color: #2500f9 !important;
}

.form.was-validated .custom-control-input:valid ~ .custom-control-label {
  color: #000000;
}

.form.was-validated
  .custom-control-input:valid
  ~ .custom-control-label::before {
  border-color: #2500f9;
}

.form.was-validated
  .custom-control-input:valid:checked
  ~ .custom-control-label::before {
  background-color: #2500f9;
}

.form .secondary-btn {
  font-size: 1.125rem;
}

@media (min-width: 1401px) {
  .form .primary-btn {
    height: 5.3125rem;
  }
}

/* Header Section Style */
.header {
  position: absolute;
  top: 0;
  z-index: 9;
}

@media (min-width: 992px) {
  .header {
    padding-top: 1.4375rem;
  }
}

.header .navbar {
  padding-top: 0.9375rem;
  padding-bottom: 0.9375rem;
}

.header .navbar-toggler {
  font-size: 1.625rem;
  color: #242f51;
  z-index: 8;
}

.header .navbar-toggler:hover {
  color: #2500f9;
}

.header .navbar-toggler[aria-expanded="true"] {
  color: #f55767;
}

@media (max-width: 991px) {
  .header .navbar-collapse {
    position: fixed;
    top: 0;
    right: 0;
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -o-transform: translateX(100%);
    transform: translateX(100%);
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -moz-box-orient: vertical;
    -moz-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    width: 50%;
    height: 100vh;
    background-color: #f6faff;
    -webkit-transition: -webkit-transform ease-in-out 0.3s;
    transition: -webkit-transform ease-in-out 0.3s;
    -o-transition: -o-transform ease-in-out 0.3s;
    -moz-transition: transform ease-in-out 0.3s, -moz-transform ease-in-out 0.3s;
    transition: transform ease-in-out 0.3s;
    transition: transform ease-in-out 0.3s, -webkit-transform ease-in-out 0.3s,
      -moz-transform ease-in-out 0.3s, -o-transform ease-in-out 0.3s;
  }
  .header .navbar-collapse.show {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
  }
  .header .navbar-collapse .navbar-nav {
    width: 100%;
    margin-top: 1.25rem;
  }
  .header .navbar-collapse .navbar-nav .nav-item {
    margin: 0.3rem 0.6rem;
  }
}

@media (max-width: 767px) {
  .header .navbar-collapse {
    width: 100%;
  }
}

@media (min-width: 992px) {
  .header .navbar .nav-item .dropdown-toggle::after {
    display: none;
  }
}

.header .navbar .nav-item .dropdown-menu {
  max-width: 9.375rem;
  background-color: #817aff;
  padding: 0.3125rem;
}

@media (min-width: 992px) {
  .header .navbar .nav-item .dropdown-menu {
    display: block;
    -webkit-transform: translateY(40%);
    -moz-transform: translateY(40%);
    -ms-transform: translateY(40%);
    -o-transform: translateY(40%);
    transform: translateY(40%);
    opacity: 0;
    visibility: hidden;
    -webkit-box-shadow: 0 5px 15px rgba(36, 47, 81, 0.1);
    box-shadow: 0 5px 15px rgba(36, 47, 81, 0.1);
  }
}

.header .navbar .nav-item .dropdown-item {
  border-radius: inherit;
  color: #ffffff;
}

.header .navbar .nav-item .dropdown-item:not(:last-child) {
  margin-bottom: 0.3125rem;
}

.header .navbar .nav-item .dropdown-item.active,
.header .navbar .nav-item .dropdown-item:active,
.header .navbar .nav-item .dropdown-item:hover,
.header .navbar .nav-item .dropdown-item:focus {
  color: #242f51;
  background-color: #ffffff;
}

@media (min-width: 992px) {
  .header .navbar .nav-item.dropdown::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    -ms-transform: translateY(100%);
    -o-transform: translateY(100%);
    transform: translateY(100%);
    width: 100%;
    height: 100%;
    cursor: pointer;
    pointer-events: none;
  }
  .header .navbar .nav-item.dropdown:hover::before,
  .header .navbar .nav-item.dropdown:focus::before {
    pointer-events: all;
  }
  .header .navbar .nav-item.dropdown:hover .dropdown-menu,
  .header .navbar .nav-item.dropdown:focus .dropdown-menu {
    -webkit-transform: translateY(28%);
    -moz-transform: translateY(28%);
    -ms-transform: translateY(28%);
    -o-transform: translateY(28%);
    transform: translateY(28%);
    opacity: 1;
    visibility: visible;
  }
}

.header .navbar .nav-item.dropdown:hover .nav-link,
.header .navbar .nav-item.dropdown:focus .nav-link {
  color: #2500f9;
}

@media (min-width: 992px) {
  .header .navbar .nav-item .primary-btn {
    margin-left: 1.21875rem;
  }
}

.header .navbar .nav-link {
  color: #5a5a5a;
  font-size: 1rem;
  font-weight: 500;
  padding-left: 1.21875rem;
  padding-right: 1.21875rem;
}

.header .navbar .nav-link.active,
.header .navbar .nav-link:hover,
.header .navbar .nav-link:focus {
  color: #2500f9;
}

@media (min-width: 992px) {
  .header .navbar .nav-link:focus ~ .dropdown-menu {
    -webkit-transform: translateY(28%);
    -moz-transform: translateY(28%);
    -ms-transform: translateY(28%);
    -o-transform: translateY(28%);
    transform: translateY(28%);
    opacity: 1;
    visibility: visible;
  }
}

.header--primary {
  background-color: #ffffff;
}

.header--secondary .navbar-toggler {
  color: #ffffff;
}

.header--secondary .navbar-toggler:hover {
  color: #ffffff;
}

.header--secondary .navbar-toggler[aria-expanded="true"] {
  color: #f55767;
}

@media (min-width: 992px) {
  .header--secondary .navbar .nav-item.dropdown:hover .nav-link,
  .header--secondary .navbar .nav-item.dropdown:focus .nav-link {
    color: #999ca5;
  }
  .header--secondary .navbar .nav-item .primary-btn {
    border: 2px solid #ffffff;
  }
  .header--secondary .navbar .nav-item .primary-btn:hover,
  .header--secondary .navbar .nav-item .primary-btn:focus {
    color: #242f51;
    background-color: #ffffff;
  }
  .header--secondary .navbar .nav-link {
    color: #ffffff;
  }
  .header--secondary .navbar .nav-link.active,
  .header--secondary .navbar .nav-link:hover,
  .header--secondary .navbar .nav-link:focus {
    color: #999ca5;
  }
}

.header--secondary.header--fixed {
  background-color: #242f51;
}

.header--fixed {
  position: fixed;
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  -o-transform: translateY(-100%);
  transform: translateY(-100%);
  padding-top: 0;
  -webkit-box-shadow: 0 3px 18px rgba(0, 0, 0, 0.05);
  box-shadow: 0 3px 18px rgba(0, 0, 0, 0.05);
  -webkit-animation: header_in 0.4s linear forwards;
  -moz-animation: header_in 0.4s linear forwards;
  -o-animation: header_in 0.4s linear forwards;
  animation: header_in 0.4s linear forwards;
}

/* Fixed Header animation */
@-webkit-keyframes header_in {
  0% {
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
@-moz-keyframes header_in {
  0% {
    -moz-transform: translateY(-100%);
    transform: translateY(-100%);
  }
  100% {
    -moz-transform: translateY(0);
    transform: translateY(0);
  }
}
@-o-keyframes header_in {
  0% {
    -o-transform: translateY(-100%);
    transform: translateY(-100%);
  }
  100% {
    -o-transform: translateY(0);
    transform: translateY(0);
  }
}
@keyframes header_in {
  0% {
    -webkit-transform: translateY(-100%);
    -moz-transform: translateY(-100%);
    -o-transform: translateY(-100%);
    transform: translateY(-100%);
  }
  100% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
  }
}

/* Off Canvas Navbar Toggler */
.offCanvasMenuCloser {
  top: 0;
  left: 0;
  -webkit-transform: translateX(100%);
  -moz-transform: translateX(100%);
  -ms-transform: translateX(100%);
  -o-transform: translateX(100%);
  transform: translateX(100%);
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 8;
  opacity: 0;
  -webkit-transition: opacity 0.4s ease 0.4s;
  -o-transition: opacity 0.4s ease 0.4s;
  -moz-transition: opacity 0.4s ease 0.4s;
  transition: opacity 0.4s ease 0.4s;
  display: none;
}

.offCanvasMenuCloser.show {
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  transform: translateX(0);
  opacity: 1;
}

@media (min-width: 768px) and (max-width: 991px) {
  .offCanvasMenuCloser {
    display: block;
  }
}

/* Parallax Banner Section Style */
.parallax-banner .shape {
  -webkit-transition: -webkit-transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0s;
  transition: -webkit-transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0s;
  -o-transition: -o-transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0s;
  -moz-transition: transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0s,
    -moz-transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0s;
  transition: transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0s;
  transition: transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0s,
    -webkit-transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0s,
    -moz-transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0s,
    -o-transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0s;
  will-change: transform;
}

.parallax-banner .shape__image {
  -webkit-animation: pulse 3s linear infinite;
  -moz-animation: pulse 3s linear infinite;
  -o-animation: pulse 3s linear infinite;
  animation: pulse 3s linear infinite;
  -webkit-animation-delay: calc(var(--i) * 1s);
  -moz-animation-delay: -moz-calc(var(--i) * 1s);
  -o-animation-delay: calc(var(--i) * 1s);
  animation-delay: calc(var(--i) * 1s);
}

@-webkit-keyframes pulse {
  0%,
  100% {
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }
  50% {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
  }
}

@-moz-keyframes pulse {
  0%,
  100% {
    -moz-transform: scale(0.8);
    transform: scale(0.8);
  }
  50% {
    -moz-transform: scale(1.2);
    transform: scale(1.2);
  }
}

@-o-keyframes pulse {
  0%,
  100% {
    -o-transform: scale(0.8);
    transform: scale(0.8);
  }
  50% {
    -o-transform: scale(1.2);
    transform: scale(1.2);
  }
}

@keyframes pulse {
  0%,
  100% {
    -webkit-transform: scale(0.8);
    -moz-transform: scale(0.8);
    -o-transform: scale(0.8);
    transform: scale(0.8);
  }
  50% {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
  }
}

/* Banner Section Style */
.banner {
  background: rgba(255, 255, 255, 0.97) url(../images/banner/banner-bg.png)
    no-repeat center;
  background-size: cover;
  background-blend-mode: overlay;
  padding: 3.75rem 0 0.625rem;
}

@media (min-width: 992px) {
  .banner {
    padding: 0.625rem 0;
  }
}

@media (min-width: 1401px) {
  .banner {
    padding: 5.625rem 0;
  }
}

.banner .shape {
  -webkit-transition: -webkit-transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0s;
  transition: -webkit-transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0s;
  -o-transition: -o-transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0s;
  -moz-transition: transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0s,
    -moz-transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0s;
  transition: transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0s;
  transition: transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0s,
    -webkit-transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0s,
    -moz-transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0s,
    -o-transform 0.8s cubic-bezier(0.5, 1, 0.89, 1) 0s;
  will-change: transform;
}

.banner .shape--1 {
  top: 65%;
  left: 2%;
}

.banner .shape--2 {
  top: 10%;
  left: 6%;
}

.banner .shape--3 {
  top: 85%;
  left: 25%;
}

.banner .shape--4 {
  top: 15%;
  left: 35%;
}

.banner .shape--5 {
  top: 65%;
  left: 53%;
  opacity: 0.4;
}

.banner .shape--6 {
  top: 90%;
  left: 58%;
}

.banner .shape--7 {
  top: 80%;
  left: 92%;
}

.banner .shape__image {
  -webkit-animation: pulse 2s cubic-bezier(0.5, 1, 0.89, 1) infinite;
  -moz-animation: pulse 2s cubic-bezier(0.5, 1, 0.89, 1) infinite;
  -o-animation: pulse 2s cubic-bezier(0.5, 1, 0.89, 1) infinite;
  animation: pulse 2s cubic-bezier(0.5, 1, 0.89, 1) infinite;
  -webkit-animation-delay: calc(var(--i) * 1s);
  -moz-animation-delay: -moz-calc(var(--i) * 1s);
  -o-animation-delay: calc(var(--i) * 1s);
  animation-delay: calc(var(--i) * 1s);
}

@keyframes pulse {
  0%,
  100% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
  }
}

.banner__title {
  font-size: 2.1875rem;
  font-weight: 600;
}

@media (max-width: 575px) {
  .banner__title {
    font-weight: 700;
  }
}

@media (min-width: 768px) {
  .banner__title {
    font-size: 3.125rem;
  }
}

@media (min-width: 992px) {
  .banner__title {
    letter-spacing: 0.1875rem;
  }
}

@media (min-width: 1200px) {
  .banner__title {
    font-size: 2.5rem;
    font-weight: 700;
  }
}

.banner__text {
  font-size: 1.125rem;
  margin: 1.75rem 0 2.625rem;
}

@media (min-width: 576px) {
  .banner .primary-btn {
    margin-right: 2.125rem;
  }
}

@media (max-width: 991px) {
  .banner__image {
    max-width: 20rem;
  }
}

/* Sub Banner Section Style */
.sub-banner {
  padding: 10rem 0 6.875rem;
}

.sub-banner__canvas,
.sub-banner .parallax-banner {
  top: 0;
  left: 0;
  -webkit-clip-path: ellipse(100% 100% at 50% 0%);
  clip-path: ellipse(100% 100% at 50% 0%);
}

.sub-banner__canvas {
  background-color: #175cff;
}

.sub-banner .parallax-banner .shape--1 {
  top: 70%;
  left: 14%;
}

.sub-banner .parallax-banner .shape--2 {
  top: 48%;
  left: 20%;
}

@media (min-width: 768px) {
  .sub-banner .parallax-banner .shape--2 {
    left: 32%;
  }
}

.sub-banner .parallax-banner .shape--3 {
  top: 44%;
  left: 69%;
}

.sub-banner .parallax-banner .shape--4 {
  top: 22%;
  left: 80%;
}

@media (min-width: 768px) {
  .sub-banner .parallax-banner .shape--4 {
    top: 40%;
    left: 95%;
  }
}

@media (min-width: 1601px) {
  .sub-banner .parallax-banner .shape--4 {
    left: 85%;
  }
}

.sub-banner__title {
  color: #ffffff;
  font-size: 2.375rem;
}

/* About Section Style */
.about__title {
  font-size: 2.1875rem;
}

@media (min-width: 768px) {
  .about__title {
    font-size: 2.375rem;
  }
}

.about__text {
  margin: 1.75rem 0 2.625rem;
}

@media (max-width: 991px) {
  .about__image {
    max-width: 30rem;
  }
}

/* Feature Section Style */
.feature__text {
  margin-bottom: 2.1875rem;
}

.feature__block {
  margin-bottom: 3.4375rem;
}

@media (min-width: 576px) {
  .feature__block__image {
    margin-right: 2.1875rem;
  }
}

.feature__block__title {
  font-size: 1.21875rem;
}

@media (max-width: 991px) {
  .feature__image {
    max-width: 20rem;
  }
}

@media (max-width: 1400px) {
  .feature__image {
    width: 100%;
  }
}

@media (min-width: 992px) {
  .feature__image {
    margin-top: -4rem;
  }
}

/* Community Section Style */
.community {
  color: #707276;
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(98%, #f6faff),
    color-stop(98%, transparent)
  );
  background: -webkit-linear-gradient(#f6faff 98%, transparent 98%);
  background: -moz-linear-gradient(#f6faff 98%, transparent 98%);
  background: -o-linear-gradient(#f6faff 98%, transparent 98%);
  background: linear-gradient(#f6faff 98%, transparent 98%);
}

.community .shape--left {
  bottom: 0;
  -webkit-transform: translateX(-40%);
  -moz-transform: translateX(-40%);
  -ms-transform: translateX(-40%);
  -o-transform: translateX(-40%);
  transform: translateX(-40%);
}

.community .shape--right {
  right: 0;
  -webkit-transform: translate(60%, -20%);
  -moz-transform: translate(60%, -20%);
  -ms-transform: translate(60%, -20%);
  -o-transform: translate(60%, -20%);
  transform: translate(60%, -20%);
}

.community__quote-slide__details {
  margin-top: 1.9375rem;
}

.community__quote-slide__avatar {
  width: 4.5rem;
  height: 4.5rem;
  margin-right: 1.3125rem;
}

.community__quote-slide__author {
  font-size: 1.125rem;
  font-weight: 600;
}

@media (max-width: 480px) {
  .community__preview-slider {
    margin-top: 5.3125rem;
  }
}

@media (min-width: 481px) {
  .community__preview-slider {
    margin-top: 2.5625rem;
  }
}

.p-20 {
  padding: 20px;
}

.feature-card:hover {
  box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.3);
}

.community__preview-slide__image {
  margin-bottom: 1.75rem;
}

.community__preview-slide__avatar {
  left: 10%;
  bottom: 10%;
  width: 4.75rem;
  height: 4.75rem;
  border: 4px solid #ffffff;
}

.community__preview-slide__author {
  font-size: 1.375rem;
}

/* Pricing Section Style */
.pricing__block {
  border-radius: 0.6875rem;
  margin-bottom: 1.875rem;
}

@media (max-width: 767px) {
  .pricing__block {
    max-width: 21.875rem;
  }
}

.pricing__block.active {
  -webkit-box-shadow: 1.0625rem 2.0625rem 6.1875rem rgba(129, 122, 255, 0.26);
  box-shadow: 1.0625rem 2.0625rem 6.1875rem rgba(129, 122, 255, 0.26);
}

.pricing__block__head,
.pricing__block__body {
  border-width: 0.5px;
  border-style: solid;
}

.pricing__block__head {
  padding: 1.875rem 0 3.125rem;
  background-color: #f7f9fb;
  border-color: #f7f9fb;
  border-bottom-width: 0;
  border-top-left-radius: 0.6875rem;
  border-top-right-radius: 0.6875rem;
}

@media (min-width: 992px) {
  .pricing__block__head {
    padding: 3.8125rem 0;
  }
}

.pricing__block__price,
.pricing__block__access {
  font-weight: 600;
}

.pricing__block__price__amount {
  font-size: 2.5rem;
}

@media (min-width: 768px) {
  .pricing__block__price__amount {
    font-size: 3.75rem;
  }
}

.pricing__block__price__period {
  font-size: 0.875rem;
}

@media (min-width: 768px) {
  .pricing__block__price__period {
    font-size: 1.0625rem;
  }
}

.pricing__block__access {
  font-size: 0.875rem;
  margin-top: 0.625rem;
}

@media (min-width: 768px) {
  .pricing__block__access {
    margin-top: 1.25rem;
    font-size: 1.25rem;
  }
}

.pricing__block__recommended {
  color: #817aff;
  font-weight: 500;
}

.pricing__block__body {
  border-color: rgba(207, 205, 205, 0.7);
  border-top-width: 0;
  border-bottom-left-radius: 0.6875rem;
  border-bottom-right-radius: 0.6875rem;
  height: 400px;
  padding: 1.25rem 0;
}

.pricing__block__body__text {
  height: 500px;
}

@media (min-width: 768px) {
  .pricing__block__body {
    padding: 2.25rem 0;
  }
}

.pricing__block__list__item {
  color: #999ca5;
  margin-bottom: 0.9375rem;
}

@media (min-width: 992px) {
  .pricing__block__list__item {
    margin-bottom: 1.5625rem;
  }
}

/* F.A.Q. Section Style */
.faq .accordion {
  margin-top: 2.1875rem;
}

@media (min-width: 992px) {
  .faq .accordion {
    margin-top: 3.4375rem;
  }
}

/* Get Started Section Style */
.get-start {
  color: #707276;
  background-color: #f6faff;
}

@media (min-width: 1200px) {
  .get-start .section-header__title {
    font-size: 3.4375rem;
  }
}

.get-start__cautious-text {
  font-size: 0.75rem;
}

/* Login Section Style */
.login__image {
  top: 0;
  left: 0;
  height: 100%;
}

@media (min-width: 992px) {
  .login__image {
    width: 50%;
  }
}

@media (min-width: 1401px) {
  .login__image {
    width: 48%;
  }
}

@media (min-width: 1200px) and (max-width: 1400px) {
  .login__content {
    padding: 0 2rem;
  }
}

.login__title,
.login__text {
  text-align: center;
}

@media (min-width: 1401px) {
  .login__title,
  .login__text {
    text-align: left;
  }
}

.login__title,
.login__form-title {
  color: #242f51;
  font-size: 1.875rem;
}

@media (min-width: 768px) {
  .login__title,
  .login__form-title {
    font-size: 2.5rem;
  }
}

@media (min-width: 1200px) {
  .login__title,
  .login__form-title {
    font-size: 2.8125rem;
  }
}

@media (min-width: 1401px) {
  .login__text {
    padding-left: 4rem;
  }
}

.login__text,
.login__form-text {
  color: #686666;
}

@media (min-width: 768px) {
  .login__text,
  .login__form-text {
    font-size: 1.125rem;
  }
}

.login__form-text {
  font-weight: 600;
}

.login__form {
  margin-top: 2.8125rem;
}

@media (min-width: 1401px) {
  .login__form {
    margin-top: 4.25rem;
  }
}

.login__form-footer_text {
  font-size: 1.125rem;
  margin-top: 2.5625rem;
}

/* Blog Section Style */
.blog__card {
  margin-bottom: 2.1875rem;
}

.blog__card__head {
  border-radius: 0.3125rem 0.3125rem 0 0;
}

.blog__card__head:hover .blog__card__image,
.blog__card__head:focus .blog__card__image {
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
  transform: scale(1.1);
  -webkit-filter: grayscale(0.4);
  filter: grayscale(0.4);
}

.blog__card__body {
  padding: 1.4375rem 0.9375rem;
  -webkit-box-shadow: 0 0 6.1875rem rgba(0, 0, 0, 0.08);
  box-shadow: 0 0 6.1875rem rgba(0, 0, 0, 0.08);
  border-radius: 0 0 0.3125rem 0.3125rem;
}

@media (min-width: 768px) {
  .blog__card__body {
    padding: 1.4375rem 1.25rem;
  }
}

@media (min-width: 1200px) {
  .blog__card__body {
    padding: 1.4375rem 2.25rem;
  }
}

.blog__card__title {
  color: #333333;
  font-size: 1.375rem;
  font-weight: 600;
}

.blog__card__title__link:hover,
.blog__card__title__link:focus {
  color: #2500f9;
}

.blog__card__meta {
  margin-top: 0.75rem;
  margin-bottom: 1.375rem;
}

.blog__card__meta__time {
  color: #2563ff;
  font-weight: 500;
}

.blog__card__meta__time__icon {
  font-size: 1.375rem;
}

.blog__card__meta > * {
  margin-top: 0.625rem;
}

.blog__card__authore__avatar {
  width: 4.375rem;
  height: 4.375rem;
  margin-right: 0.625rem;
}

@media (min-width: 576px) {
  .blog__card__authore__avatar {
    margin-right: 1.375rem;
  }
}

.blog__card__authore__name {
  color: #333333;
  font-size: 1.125rem;
}

.blog__card__authore__name__link:hover,
.blog__card__authore__name__link:focus {
  text-decoration: underline;
}

.blog__card__authore__role {
  color: #707276;
  font-size: 0.8125rem;
}

@media (min-width: 768px) {
  .blog__card--horizontal .blog__card__head {
    border-radius: 0.3125rem 0 0 0.3125rem;
  }
}

.blog__card--horizontal .blog__card__title {
  color: #242f51;
}

@media (min-width: 992px) {
  .blog__card--horizontal .blog__card__title {
    font-size: 1.5625rem;
    margin-bottom: 2.1875rem;
  }
}

@media (min-width: 768px) {
  .blog__card--horizontal .blog__card__body {
    border-radius: 0 0.3125rem 0.3125rem 0;
  }
}

@media (min-width: 992px) {
  .blog__card--horizontal .blog__card__body {
    padding: 2.5rem 2.8125rem;
  }
}

/* Blog Details Section Style */
.blog-details__card {
  color: #707276;
}

.blog-details__card__image {
  border-radius: 0.3125rem;
}

.blog-details__card__title {
  color: #242f51;
  font-size: 2rem;
  font-weight: 600;
}

.blog-details__card__title__link:hover,
.blog-details__card__title__link:focus {
  color: #2500f9;
}

@media (min-width: 768px) {
  .blog-details__card__list {
    margin: 3.4375rem 0;
  }
}

.blog-details__card__list__item {
  padding-left: 0.9375rem;
}

.blog-details__card__list__item:not(:last-child) {
  margin-bottom: 0.9375rem;
}

.blog-details__card__list__item::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  -webkit-transform: translate(-100%, -50%);
  -moz-transform: translate(-100%, -50%);
  -ms-transform: translate(-100%, -50%);
  -o-transform: translate(-100%, -50%);
  transform: translate(-100%, -50%);
  width: 0.875rem;
  height: 0.875rem;
  border-radius: 50%;
  background-color: #175cff;
}

/* Footer Section Style */
.footer {
  margin: 3.90625rem 0;
}

.footer::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: #fafcff;
  z-index: -1;
}

@media (min-width: 1601px) {
  .footer::before {
    width: 85%;
  }
}

.footer__top {
  padding: 5.53125rem 0;
}

@media (max-width: 991px) {
  .footer__top {
    padding: 3rem 0;
  }
}

@media (max-width: 991px) {
  .footer__block {
    margin-bottom: 1.875rem;
  }
}

.footer__block__logo,
.footer__block__title {
  margin-bottom: 1.625rem;
}

.footer__block__title {
  color: #000000;
  font-size: 1.375rem;
  font-weight: 600;
}

.footer__block__list__item:not(:last-child) {
  margin-bottom: 1rem;
}

.footer__block__list__link {
  color: #343434;
  font-weight: 500;
}

.footer__block__list__link:hover,
.footer__block__list__link:focus {
  color: #2500f9;
  text-decoration: underline;
}

.footer__bottom {
  padding-bottom: 2.625rem;
}

.footer__copyright {
  color: #808080;
  font-size: 1.0625rem;
}

.footer__copyright__link:hover,
.footer__copyright__link:focus {
  color: #2500f9;
  text-decoration: underline;
}
/*# sourceMappingURL=style.css.map */