/* ----------------------------------------------------
Template Name: DriftCrop - App Landing Page
Author: CreativeJeff
URL: https://DriftCropapp.uiexpertin.com/
Version: 1.0;
------------------------------------------------------- */
/*  -------------------------------
CSS Table of Content

odoo colors: #714B67
rgb 113, 75, 103
-------------
deg: 150deg
from: #714B67
to: #542D4B
-------------

00. Typography
01. Global base style
02. Pre-loader style
03. Typography style
04. Button style
05. Scroll bar style
06. Header Navigation style
07. Hero welcome Header style
08. Welcome Section style
09. How it Works style
10. Screenshots style
11. Pricing style
12. Clients style
13. Our team style
14. Newsletter style
15. Subscribe style
16. FAQ's style
17. FAQ's Form style
18. Coming Soon style
19. Page Not Found style
20. Pagination style
21. Blog style
22. Login Register style
23. Parallax background image style
24. Swiper Custom style
25. Footer style
26. Animation style
27. Demo Page Custom style
28. Responsive style
  
 ---------------------------------- */
/* --------------------------
  00. Typography
----------------------------- */
@import url("https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,600;0,700;0,800;1,400&family=Poppins:ital,wght@0,300;0,400;0,500;0,600;1,400&display=swap");

/* --------------------------
  01. Global base style
----------------------------- */
body {
    font-family: "Open Sans", sans-serif;
    color: #3C404D;
    font-size: 16px;
    line-height: 1.5rem;
    font-style: normal;
    font-weight: normal;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-weight: 600;
}

a {
    text-decoration: none;
}

a:hover,
a:focus {
    color: #714B67;
}

a,
a:hover,
a:focus,
.btn:focus {
    text-decoration: none;
    outline: none;
    box-shadow: none;
}

/* Images Filter Shadow */
.img-shadow {
    -webkit-filter: drop-shadow(0px 0.625rem 1.25rem rgba(26, 26, 27, 0.2));
    filter: drop-shadow(0px 0.625rem 1.25rem rgba(26, 26, 27, 0.2));
}

/* Image Shake Animation */
.shake-item {
    -webkit-animation: shakeItem 5s linear 0s infinite normal forwards;
    animation: shakeItem 5s linear 0s infinite normal forwards;
}

section {
    overflow: hidden;
    position: relative;
}

section .section-heading {
    margin-bottom: 1.25rem;
}

section .section-heading .section-title {
    display: inline-block;
    margin-bottom: 1.25rem;
    padding-bottom: .5rem;
    position: relative;
    color: #707070;
    font-weight: 600;
}

section .section-heading .section-title:before {
    width: 100%;
    height: 2px;
    content: '';
    position: absolute;
    background: #714B67;
    border-radius: 1rem;
    top: unset;
    left: 50%;
    right: unset;
    bottom: 0;
    transform: translate(-50%, 0);
}

section .section-heading.section-heading-on-dark .section-title {
    color: #ffffff;
}

section .section-heading.section-heading-on-dark .section-title:before {
    background: #ffffff;
}

section .section-heading.section-heading-on-dark h2 {
    color: #8F8F8F;
}

section .section-heading.section-heading-on-dark p {
    color: #8F8F8F;
}

section .section-heading p {
    line-height: 1.75rem;
    font-size: 1.125rem;
    font-weight: 300;
}

section .service-thumb {
    position: relative;
    z-index: 1;
}

section .service-thumb img {
    margin-left: auto;
    margin-right: auto;
    display: block;
}

section .service-thumb img.mw-img {
    max-width: 360px;
}

section .art-background {
    background: url(../img/bg/bg-art.svg) no-repeat center center;
    background-size: 100% auto;
    position: absolute;
    top: 1rem;
    left: 1.5rem;
    right: 1.5rem;
    bottom: 1rem;
    z-index: 0;
}

.section-ptb {
    padding-top: 50px;
    padding-bottom: 50px;
}

.section-ptb-50{
    padding-top: 25px;
    padding-bottom: 25px;
}

.section-pb {
    padding-bottom: 50px;
}

/* Store Buttons */
.button-group.store-buttons {
    margin-left: -5px;
    margin-right: -5px;
}

.button-group.store-buttons a {
    padding: 5px;
    -webkit-filter: drop-shadow(0px 5px 15px rgba(0, 0, 0, 0.07));
    filter: drop-shadow(0px 5px 15px rgba(0, 0, 0, 0.07));
    transition: all 0.3s ease;
    -webkit-transform: scale(1);
    transform: scale(1);
    position: relative;
    top: 0;
}

.button-group.store-buttons a:hover {
    -webkit-transform: scale(1.02);
    transform: scale(1.02);
    top: -4px;
}

.button-group.store-buttons a:active {
    opacity: .8;
}

/* List with check list */
ul.list-with-checklist li {
    position: relative;
    padding-left: 2.625rem;
    padding-top: 0.625rem;
    padding-bottom: 0.625rem;
    font-size: 1.125rem;
    font-weight: 600;
}

ul.list-with-checklist li:before {
    content: "\F012C";
    font-family: "Material Design Icons";
    background: #714B67;
    width: 1.625rem;
    height: 1.625rem;
    border-radius: 5px;
    position: absolute;
    top: 0.625rem;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #FBFBFF;
}

ul.list-group.list-group-custom .list-group-item {
    border: none;
    margin: .5rem 0;
    padding: 5px;
    -webkit-box-align: center;
    align-items: center;
    border-radius: 10px;
    box-shadow: 0px 0.625rem 1.25rem rgba(107, 109, 112, 0.1);
    -webkit-box-shadow: 0px 0.625rem 1.25rem rgba(107, 109, 112, 0.1);
}

ul.list-group.list-group-custom .list-group-item .icon {
    width: 6.875rem;
    height: 6.875rem;
    -webkit-box-flex: 0;
    flex: 0 0 6.875rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    margin-right: 1.25rem;
    color: #714B67;
    background: #FBFBFF;
    font-size: 3rem;
}

ul.list-group.list-group-custom .list-group-item .list-content h4 {
    margin-bottom: .5rem;
}

ul.list-group.list-group-custom .list-group-item .list-content p {
    margin-bottom: 0;
}

/* VenoBox Styling */
.vbox-container .vbox-content img {
    border-radius: .8rem;
}

/* parallax Styling */
.parallax-window {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
}

/*--- Video Button ---*/
.video-btn, .how-it-works-video .how-it-works-video-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 5.25rem;
    height: 5.25rem;
    border-radius: 50%;
    background: #542D4B;
    color: #ffffff;
    font-size: 2.5rem;
    animation: shadowPulse 2s linear infinite;
    transform: scale(1);
    transition: all 0.3s ease;
    z-index: 4;
}

.video-btn:hover, .how-it-works-video .how-it-works-video-btn:hover {
    color: #ffffff;
    transform: scale(1.3);
}

/* Scroll to Top */
.scroll-to-top-btn {
    position: fixed;
    z-index: 50;
    right: 1.5rem;
    bottom: 1.5rem;
    background: #542D4B;
    background: linear-gradient(45deg, #542D4B 0%, #EE5050 100%);
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 1.375rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    box-shadow: 0px 0.625rem 1.25rem rgba(107, 109, 112, 0.1);
    -webkit-box-shadow: 0px 0.625rem 1.25rem rgba(107, 109, 112, 0.1);
    color: #ffffff;
    font-size: 1.5rem;
    opacity: 0;
    visibility: hidden;
}

.scroll-to-top-btn:active, .scroll-to-top-btn:focus {
    color: #ffffff;
}

.scroll-to-top-btn.active {
    opacity: .8;
    visibility: visible;
}

.scroll-to-top-btn.active:hover {
    opacity: 1;
    color: #fff;
    box-shadow: 0px 0.625rem 1.25rem rgba(107, 109, 112, 0.3) !important;
    -webkit-box-shadow: 0 0 0 0.2rem rgba(107, 109, 112, 0.8);
}

/*--- Used to develop DriftCrop Template ---*/
@media (min-width: 992px) {
    .build-with {
        padding-bottom: 4rem;
    }
}

.build-with a {
    margin: 1rem;
}

.build-with a img {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    border: 1px solid rgba(26, 26, 27, 0.05);
    padding: .5rem;
    background: #ffffff;
}

/*--- Scroll Mouse Animation ---*/
.scroll-down-mouse {
    position: absolute;
    width: 34px;
    height: 55px;
    left: 50%;
    transform: translateX(-50%);
    margin-left: auto;
    margin-right: auto;
    bottom: 27.5px;
}

.scroll-down-mouse:before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    width: 34px;
    height: 55px;
    border: 2px solid #714B67;
    opacity: 0.75;
    border-radius: 17px;
}

.scroll-down-mouse:after {
    content: "";
    position: absolute;
    left: 50%;
    transform: translate(-50%, 10px);
    width: 3px;
    height: 10px;
    border-radius: 25%;
    background-color: #714B67;
    animation-name: scroll;
    animation-duration: 2.2s;
    animation-timing-function: cubic-bezier(0.15, 0.41, 0.69, 0.94);
    animation-iteration-count: infinite;
}

@keyframes scroll {
    0% {
        opacity: 0;
    }
    10% {
        transform: translate(-50%, 10px);
        opacity: 1;
    }
    100% {
        transform: translate(-50%, 20px);
        opacity: 0;
    }
}

/* --------------------------
  02. Pre-loader style
----------------------------- */
.preloader {
    position: fixed;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 99999;
}

.preloader .preloader-container {
    height: 100vh;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.preloader .preloader-container .loader-section {
    position: fixed;
    top: 0;
    height: 100%;
    width: 100%;
    background-color: #ffffff;
    transform: translateY(0);
    transition: all 0.3s ease;
}

.preloader .preloader-container .preloader-effect {
    position: absolute;
    height: 50px;
    width: 170px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 99;
}

.preloader .preloader-container .preloader-effect circle.dot:nth-of-type(1) {
    -webkit-animation: slide 2s ease infinite;
    animation: slide 2s ease infinite;
}

.preloader .preloader-container .preloader-effect circle.dot:nth-of-type(2) {
    -webkit-transform: translateX(55px);
    transform: translateX(55px);
    -webkit-animation: slide 2s ease infinite;
    animation: slide 2s ease infinite;
    -webkit-animation-delay: 1s;
    animation-delay: 1s;
}

.page-loaded .loader-section {
    transform: translateY(-100%) !important;
}

.page-loaded .preloader-effect {
    -webkit-transition: 0.3s ease-out;
    transition: 0.3s ease-out;
    visibility: hidden;
    opacity: 0;
}

/* --------------------------
  03. Typography style
----------------------------- */
h1,
h2,
h3,
h4,
h5,
h6 {
    color: #3C404D;
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    letter-spacing: 0;
}

h1 {
    font-size: 3.375rem;
    font-weight: 600;
}

h2 {
    font-size: 2.5rem;
}

h3 {
    font-size: 1.5rem;
}

h4 {
    font-size: 1.25rem;
}

h5 {
    font-size: 1rem;
}

h6 {
    font-size: 0.875rem;
    font-weight: 400;
}

p {
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5rem;
    color: #707070;
}

/* --------------------------
  04. Button style
----------------------------- */
.btn {
    font-weight: 600;
    text-transform: uppercase;
    position: relative;
    z-index: 1;
    letter-spacing: 0 0.031rem;
    top: 0;
    transition: all 0.3s ease;
    /* Button Shadow Style Start */
    /* Button Shadow Style Start */
}

.btn.btn-lg {
    min-height: 3.75rem;
    font-size: 1.125rem;
    padding-left: 1.875rem;
    padding-right: 1.875rem;
    line-height: 1.125rem;
}

.btn:not(.btn-lg):not(.btn-sm) {
    min-height: 2.75rem;
    font-size: 0.875rem;
    line-height: 2.2;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
}

.btn:hover {
    top: -0.125rem;
}

.btn:focus, .btn:active {
    outline: none;
    box-shadow: none;
}

.btn.btn-primary.btn-shadow {
    box-shadow: 0 0 0 0.2rem rgba(107, 109, 112, 0.8);
}

.btn.btn-primary.btn-shadow:hover {
    box-shadow: 0 0 0 0.2rem rgba(107, 109, 112, 0.6);
}

.btn.btn-primary.btn-shadow-sm {
    box-shadow: 0 0 0 0.2rem rgba(107, 109, 112, 0.3);
}

.btn.btn-primary.btn-shadow-sm:hover {
    box-shadow: 0 0 0 0.2rem rgba(107, 109, 112, 0.5);
}

.btn.btn-primary.btn-shadow-lg {
    box-shadow: 0 0 0 0.2rem rgba(107, 109, 112, 0.3);
}

.btn.btn-primary.btn-shadow-lg:hover {
    box-shadow: 0 0 0 0.2rem rgba(107, 109, 112, 0.5);
}

.btn.btn-success.btn-shadow {
    box-shadow: 0px 0.625rem 1.25rem rgba(43, 216, 101, 0.3);
}

.btn.btn-success.btn-shadow:hover {
    box-shadow: 0px 0.625rem 1.25rem rgba(43, 216, 101, 0.6);
}

.btn.btn-success.btn-shadow-sm {
    box-shadow: 0px 0.25 0.625 rgba(43, 216, 101, 0.3);
}

.btn.btn-success.btn-shadow-sm:hover {
    box-shadow: 0px 0.25 0.625 rgba(43, 216, 101, 0.5);
}

.btn.btn-success.btn-shadow-lg {
    box-shadow: 0px 1rem 2rem rgba(43, 216, 101, 0.3);
}

.btn.btn-success.btn-shadow-lg:hover {
    box-shadow: 0px 1rem 2rem rgba(43, 216, 101, 0.5);
}

.btn.btn-warning.btn-shadow {
    box-shadow: 0px 0.625rem 1.25rem rgba(107, 109, 112, 0.5);
}

.btn.btn-warning.btn-shadow:hover {
    box-shadow: 0px 0.625rem 1.25rem rgba(107, 109, 112, 0.6);
}

.btn.btn-warning.btn-shadow-sm {
    box-shadow: 0px 0.25 0.625 rgba(107, 109, 112, 0.5);
}

.btn.btn-warning.btn-shadow-sm:hover {
    box-shadow: 0px 0.25 0.625 rgba(107, 109, 112, 0.5);
}

.btn.btn-warning.btn-shadow-lg {
    box-shadow: 0px 1rem 2rem rgba(107, 109, 112, 0.5);
}

.btn.btn-warning.btn-shadow-lg:hover {
    box-shadow: 0px 1rem 2rem rgba(107, 109, 112, 0.5);
}

.btn.btn-danger.btn-shadow {
    box-shadow: 0px 0.625rem 1.25rem rgba(238, 80, 80, 0.3);
}

.btn.btn-danger.btn-shadow:hover {
    box-shadow: 0px 0.625rem 1.25rem rgba(238, 80, 80, 0.6);
}

.btn.btn-danger.btn-shadow-sm {
    box-shadow: 0px 0.25 0.625 rgba(238, 80, 80, 0.3);
}

.btn.btn-danger.btn-shadow-sm:hover {
    box-shadow: 0px 0.25 0.625 rgba(238, 80, 80, 0.5);
}

.btn.btn-danger.btn-shadow-lg {
    box-shadow: 0px 1rem 2rem rgba(238, 80, 80, 0.3);
}

.btn.btn-danger.btn-shadow-lg:hover {
    box-shadow: 0px 1rem 2rem rgba(238, 80, 80, 0.5);
}

.btn.btn-dark-blue.btn-shadow {
    box-shadow: 0px 0.625rem 1.25rem rgba(34, 41, 64, 0.3);
}

.btn.btn-dark-blue.btn-shadow:hover {
    box-shadow: 0px 0.625rem 1.25rem rgba(34, 41, 64, 0.6);
}

.btn.btn-dark-blue.btn-shadow-sm {
    box-shadow: 0px 0.25 0.625 rgba(34, 41, 64, 0.3);
}

.btn.btn-dark-blue.btn-shadow-sm:hover {
    box-shadow: 0px 0.25 0.625 rgba(34, 41, 64, 0.5);
}

.btn.btn-dark-blue.btn-shadow-lg {
    box-shadow: 0px 1rem 2rem rgba(34, 41, 64, 0.3);
}

.btn.btn-dark-blue.btn-shadow-lg:hover {
    box-shadow: 0px 1rem 2rem rgba(34, 41, 64, 0.5);
}

.btn.btn-dark.btn-shadow {
    box-shadow: 0px 0.625rem 1.25rem rgba(60, 64, 77, 0.3);
}

.btn.btn-dark.btn-shadow:hover {
    box-shadow: 0px 0.625rem 1.25rem rgba(60, 64, 77, 0.6);
}

.btn.btn-dark.btn-shadow-sm {
    box-shadow: 0px 0.25 0.625 rgba(60, 64, 77, 0.3);
}

.btn.btn-dark.btn-shadow-sm:hover {
    box-shadow: 0px 0.25 0.625 rgba(60, 64, 77, 0.5);
}

.btn.btn-dark.btn-shadow-lg {
    box-shadow: 0px 1rem 2rem rgba(60, 64, 77, 0.3);
}

.btn.btn-dark.btn-shadow-lg:hover {
    box-shadow: 0px 1rem 2rem rgba(60, 64, 77, 0.5);
}

.btn.btn-dark-gray.btn-shadow {
    box-shadow: 0px 0.625rem 1.25rem rgba(112, 112, 112, 0.3);
}

.btn.btn-dark-gray.btn-shadow:hover {
    box-shadow: 0px 0.625rem 1.25rem rgba(112, 112, 112, 0.6);
}

.btn.btn-dark-gray.btn-shadow-sm {
    box-shadow: 0px 0.25 0.625 rgba(112, 112, 112, 0.3);
}

.btn.btn-dark-gray.btn-shadow-sm:hover {
    box-shadow: 0px 0.25 0.625 rgba(112, 112, 112, 0.5);
}

.btn.btn-dark-gray.btn-shadow-lg {
    box-shadow: 0px 1rem 2rem rgba(112, 112, 112, 0.3);
}

.btn.btn-dark-gray.btn-shadow-lg:hover {
    box-shadow: 0px 1rem 2rem rgba(112, 112, 112, 0.5);
}

.btn.btn-gray.btn-shadow {
    box-shadow: 0px 0.625rem 1.25rem rgba(199, 199, 213, 0.3);
}

.btn.btn-gray.btn-shadow:hover {
    box-shadow: 0px 0.625rem 1.25rem rgba(199, 199, 213, 0.6);
}

.btn.btn-gray.btn-shadow-sm {
    box-shadow: 0px 0.25 0.625 rgba(199, 199, 213, 0.3);
}

.btn.btn-gray.btn-shadow-sm:hover {
    box-shadow: 0px 0.25 0.625 rgba(199, 199, 213, 0.5);
}

.btn.btn-gray.btn-shadow-lg {
    box-shadow: 0px 1rem 2rem rgba(199, 199, 213, 0.3);
}

.btn.btn-gray.btn-shadow-lg:hover {
    box-shadow: 0px 1rem 2rem rgba(199, 199, 213, 0.5);
}

.btn.btn-light-gray.btn-shadow {
    box-shadow: 0px 0.625rem 1.25rem rgba(251, 251, 255, 0.3);
}

.btn.btn-light-gray.btn-shadow:hover {
    box-shadow: 0px 0.625rem 1.25rem rgba(251, 251, 255, 0.6);
}

.btn.btn-light-gray.btn-shadow-sm {
    box-shadow: 0px 0.25 0.625 rgba(251, 251, 255, 0.3);
}

.btn.btn-light-gray.btn-shadow-sm:hover {
    box-shadow: 0px 0.25 0.625 rgba(251, 251, 255, 0.5);
}

.btn.btn-light-gray.btn-shadow-lg {
    box-shadow: 0px 1rem 2rem rgba(251, 251, 255, 0.3);
}

.btn.btn-light-gray.btn-shadow-lg:hover {
    box-shadow: 0px 1rem 2rem rgba(251, 251, 255, 0.5);
}

.btn.btn-light-blue.btn-shadow {
    box-shadow: 0px 0.625rem 1.25rem rgba(217, 225, 252, 0.3);
}

.btn.btn-light-blue.btn-shadow:hover {
    box-shadow: 0px 0.625rem 1.25rem rgba(217, 225, 252, 0.6);
}

.btn.btn-light-blue.btn-shadow-sm {
    box-shadow: 0px 0.25 0.625 rgba(217, 225, 252, 0.3);
}

.btn.btn-light-blue.btn-shadow-sm:hover {
    box-shadow: 0px 0.25 0.625 rgba(217, 225, 252, 0.5);
}

.btn.btn-light-blue.btn-shadow-lg {
    box-shadow: 0px 1rem 2rem rgba(217, 225, 252, 0.3);
}

.btn.btn-light-blue.btn-shadow-lg:hover {
    box-shadow: 0px 1rem 2rem rgba(217, 225, 252, 0.5);
}

.btn.btn-facebook.btn-shadow {
    box-shadow: 0px 0.625rem 1.25rem rgba(27, 118, 244, 0.3);
}

.btn.btn-facebook.btn-shadow:hover {
    box-shadow: 0px 0.625rem 1.25rem rgba(27, 118, 244, 0.6);
}

.btn.btn-facebook.btn-shadow-sm {
    box-shadow: 0px 0.25 0.625 rgba(27, 118, 244, 0.3);
}

.btn.btn-facebook.btn-shadow-sm:hover {
    box-shadow: 0px 0.25 0.625 rgba(27, 118, 244, 0.5);
}

.btn.btn-facebook.btn-shadow-lg {
    box-shadow: 0px 1rem 2rem rgba(27, 118, 244, 0.3);
}

.btn.btn-facebook.btn-shadow-lg:hover {
    box-shadow: 0px 1rem 2rem rgba(27, 118, 244, 0.5);
}

.btn.btn-twitter.btn-shadow {
    box-shadow: 0px 0.625rem 1.25rem rgba(30, 159, 244, 0.3);
}

.btn.btn-twitter.btn-shadow:hover {
    box-shadow: 0px 0.625rem 1.25rem rgba(30, 159, 244, 0.6);
}

.btn.btn-twitter.btn-shadow-sm {
    box-shadow: 0px 0.25 0.625 rgba(30, 159, 244, 0.3);
}

.btn.btn-twitter.btn-shadow-sm:hover {
    box-shadow: 0px 0.25 0.625 rgba(30, 159, 244, 0.5);
}

.btn.btn-twitter.btn-shadow-lg {
    box-shadow: 0px 1rem 2rem rgba(30, 159, 244, 0.3);
}

.btn.btn-twitter.btn-shadow-lg:hover {
    box-shadow: 0px 1rem 2rem rgba(30, 159, 244, 0.5);
}

.btn.btn-googleplus.btn-shadow {
    box-shadow: 0px 0.625rem 1.25rem rgba(211, 72, 54, 0.3);
}

.btn.btn-googleplus.btn-shadow:hover {
    box-shadow: 0px 0.625rem 1.25rem rgba(211, 72, 54, 0.6);
}

.btn.btn-googleplus.btn-shadow-sm {
    box-shadow: 0px 0.25 0.625 rgba(211, 72, 54, 0.3);
}

.btn.btn-googleplus.btn-shadow-sm:hover {
    box-shadow: 0px 0.25 0.625 rgba(211, 72, 54, 0.5);
}

.btn.btn-googleplus.btn-shadow-lg {
    box-shadow: 0px 1rem 2rem rgba(211, 72, 54, 0.3);
}

.btn.btn-googleplus.btn-shadow-lg:hover {
    box-shadow: 0px 1rem 2rem rgba(211, 72, 54, 0.5);
}

.btn.btn-instagram.btn-shadow {
    box-shadow: 0px 0.625rem 1.25rem rgba(226, 49, 108, 0.3);
}

.btn.btn-instagram.btn-shadow:hover {
    box-shadow: 0px 0.625rem 1.25rem rgba(226, 49, 108, 0.6);
}

.btn.btn-instagram.btn-shadow-sm {
    box-shadow: 0px 0.25 0.625 rgba(226, 49, 108, 0.3);
}

.btn.btn-instagram.btn-shadow-sm:hover {
    box-shadow: 0px 0.25 0.625 rgba(226, 49, 108, 0.5);
}

.btn.btn-instagram.btn-shadow-lg {
    box-shadow: 0px 1rem 2rem rgba(226, 49, 108, 0.3);
}

.btn.btn-instagram.btn-shadow-lg:hover {
    box-shadow: 0px 1rem 2rem rgba(226, 49, 108, 0.5);
}

.btn.btn-pinterest.btn-shadow {
    box-shadow: 0px 0.625rem 1.25rem rgba(233, 1, 37, 0.3);
}

.btn.btn-pinterest.btn-shadow:hover {
    box-shadow: 0px 0.625rem 1.25rem rgba(233, 1, 37, 0.6);
}

.btn.btn-pinterest.btn-shadow-sm {
    box-shadow: 0px 0.25 0.625 rgba(233, 1, 37, 0.3);
}

.btn.btn-pinterest.btn-shadow-sm:hover {
    box-shadow: 0px 0.25 0.625 rgba(233, 1, 37, 0.5);
}

.btn.btn-pinterest.btn-shadow-lg {
    box-shadow: 0px 1rem 2rem rgba(233, 1, 37, 0.3);
}

.btn.btn-pinterest.btn-shadow-lg:hover {
    box-shadow: 0px 1rem 2rem rgba(233, 1, 37, 0.5);
}

.btn.btn-primary:hover {
    background-color: #714B67;
    border-color: #714B67;
}

.btn.btn-success:hover {
    background-color: #41dc75;
    border-color: #41dc75;
}

.btn.btn-warning:hover {
    background-color: #714B67;
    border-color: #714B67;
}

.btn.btn-danger:hover {
    background-color: #f06767;
    border-color: #f06767;
}

.btn.btn-dark-blue:hover {
    background-color: #2b3451;
    border-color: #2b3451;
}

.btn.btn-dark:hover {
    background-color: #474c5b;
    border-color: #474c5b;
}

.btn.btn-dark-gray:hover {
    background-color: #7d7d7d;
    border-color: #7d7d7d;
}

.btn.btn-gray:hover {
    background-color: #d6d6e0;
    border-color: #d6d6e0;
}

.btn.btn-light-gray:hover {
    background-color: white;
    border-color: white;
}

.btn.btn-light-blue:hover {
    background-color: #f1f4fe;
    border-color: #f1f4fe;
}

.btn.btn-facebook:hover {
    background-color: #3385f5;
    border-color: #3385f5;
}

.btn.btn-twitter:hover {
    background-color: #36a9f5;
    border-color: #36a9f5;
}

.btn.btn-googleplus:hover {
    background-color: #d85b4b;
    border-color: #d85b4b;
}

.btn.btn-instagram:hover {
    background-color: #e5477c;
    border-color: #e5477c;
}

.btn.btn-pinterest:hover {
    background-color: #fe062c;
    border-color: #fe062c;
}

/* --------------------------
  05. Scroll bar style
----------------------------- */
::-webkit-scrollbar {
    width: 0.313rem;
    height: 0.313rem;
}

::-webkit-scrollbar-track {
    background: #FBFBFF;
}

::-webkit-scrollbar-thumb {
    background-color: #714B67;
    outline: 1px solid #002699;
    border-radius: 0.313rem;
}

/* --------------------------
  06. Header Navigation style
----------------------------- */
.navbar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    padding-top: 40px;
    padding-bottom: 0;
    z-index: 999;
    -webkit-transition: .3s;
    transition: .3s;
    background: transparent;
}

.navbar .nav-title {
    position: absolute;
    height: 54px;
    top: 0;
    padding-left: 1.25rem;
    display: flex;
    align-items: center;
}

.navbar .navbar-nav .nav-link {
    padding-right: 2.25rem;
    padding-left: 1.25rem;
    -webkit-transition: .3s;
    transition: .3s;
    font-weight: 400;
    font-family: "Poppins", sans-serif;
}

.navbar .navbar-nav .nav-link:not(.dropdown-toggle) {
    padding-right: 1.25rem;
}

.navbar .logo-image {
    min-width: 172px;
    position: relative;
    min-height: 34px;
}

@media (min-width: 991px) {
    .navbar .logo-image {
        min-height: 56px;
    }
}

.navbar .logo-image img {
    position: absolute;
    left: 0;
    top: 0;
    max-width: 100%;
    transition: all 0.3s ease;
    max-height: 56px;
}

.navbar .logo-image img.logo-on-white {
    opacity: 0;
}

.navbar .logo-image img.logo-on-dark {
    opacity: 1;
}
@media (min-width: 992px) {
    .navbar .logo-image img.logo-on-white[alt=Bnow] {
        opacity: 1;
    }

    .navbar .logo-image img.logo-on-dark[alt=Bnow] {
        opacity: 0;
    }
}

.navbar.navbar-sticky-on-top {
    transition: all 0.3s ease;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 20px;
    top: 0;
    background: #fff;
  padding-bottom: 1.625rem;
}

.navbar.navbar-sticky-on-top .logo-image img.logo-on-white {
    opacity: 1;
}

.navbar.navbar-sticky-on-top .logo-image img.logo-on-dark {
    opacity: 0;
}


/*NAVBAR DARK*/
.navbar-dark .navbar-nav .nav-link {
    color: #000000;
}

.navbar-dark .btn-outline {
    color: #fff;
}

.navbar-dark.navbar-sticky-on-top .navbar-nav .nav-link {
    color: #7e8085;
}

.navbar-dark.navbar-sticky-on-top .navbar-nav .nav-link:hover, .navbar-dark.navbar-sticky-on-top .navbar-nav .nav-link:focus, .navbar-dark.navbar-sticky-on-top .navbar-nav .nav-link.active, .navbar-dark.navbar-sticky-on-top .navbar-nav .nav-link.current-menu-item {
    color: #2c2e30;
}

/*---------- Bootstrap Nav Custom Hover ----------*/
.dropdown-menu {
    border: 0;
    padding: 0;
    margin: 0;
    -webkit-transition: .3s;
    transition: .3s;
}

.dropdown-menu > li {
    padding: 0;
}

/* Main Menu caret */
.dropdown > .dropdown-toggle {
    position: relative;
}

.dropdown > .dropdown-toggle:after {
    border: none;
    content: '\F0140';
    font-family: "Material Design Icons";
    vertical-align: unset;
    font-size: 18px;
    position: absolute;
    width: 2.25rem;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    text-align: center;
    margin: 0;
}

.dropdown .dropdown-item {
    padding-top: 1rem;
    padding-bottom: 1rem;
    padding-right: 1.5rem;
    padding-left: 1.5rem;
    font-family: "Poppins", sans-serif;
    font-size: 0.8125rem;
    font-weight: 700;
    color: #2c2e30;
    -webkit-transition: .3s;
    transition: .3s;
    position: relative;
}

.dropdown .dropdown-item:active {
    background: #714B67;
    color: #ffffff;
}

.dropdown .dropdown-sub-menu {
    position: relative;
    /*  Sub Menu cater */
}

.dropdown .dropdown-sub-menu > .dropdown-menu {
    top: 0;
    left: 100%;
}

.dropdown .dropdown-sub-menu > .dropdown-menu .dropdown-item {
    padding-left: 2.5rem;
}

.dropdown .dropdown-sub-menu .dropdown-toggle:after {
    border: none;
    content: '\F0140';
    font-family: "Material Design Icons";
    vertical-align: unset;
    font-size: 18px;
    position: absolute;
    width: 2.25rem;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%) rotate(0);
    transform: translateY(-50%) rotate(0);
    text-align: center;
    color: #bdc0cb;
    margin: 0;
    transition: all 0.3s ease;
}

.dropdown .dropdown-sub-menu:hover .dropdown-toggle:after {
    text-decoration: none;
    transform: translateY(-50%) rotate(-90deg);
}

.my-element {
    animation: fadeIn;
    /* referring directly to the animation's @keyframe declaration */
    animation-duration: .5s;
    /* don't forget to set a duration! */
}

/* --------------------------
  07. Hero welcome Header style
----------------------------- */
.welcome-area {
    min-height: 100vh;
    padding-top: 100px;
    /*--- Full Screen Shape or BG Style Start ---*/
    /*--- Full Screen Shape or BG Style End ---*/
    /*--- Bottom Screen Shape or BG Style style ---*/
    /*--- Bottom Screen Shape or BG Style style ---*/
}

.welcome-area.bg-overlay {
    position: relative;
}

.welcome-area.bg-overlay:before {
    /*background: #03c;*/
    /*background: linear-gradient(45deg, #03c 0%, #8900cc 100%);*/
    background: rgb(11, 31, 43);
    background: linear-gradient(61deg, rgba(11, 31, 43, 1) 9%, rgba(113, 75, 103, 1) 58%);
    opacity: 0.95;
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

@media (min-width: 992px) {
    .welcome-area.bg-overlay:before {
        z-index: -1;
        background: #fff;
    }
}

.welcome-area.bg-overlay.overlay-one:before {
    /*background: #9e35ae;*/
    /*background: linear-gradient(45deg, #9e35ae 0%, #2828b1 100%);*/
    background: rgb(11, 31, 43);
    background: linear-gradient(61deg, rgba(11, 31, 43, 1) 9%, rgba(151, 57, 126, 1) 58%);
}

.welcome-area .welcome-intro {
    position: relative;
    z-index: 2;
    text-shadow: 0 0 7px rgba(0,0,0,0.5);
}

.welcome-area .welcome-intro .hero-subscribe {
    max-width: 606px;
}

.welcome-area .welcome-thumb {
    max-width: 350px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    z-index: 2;
}

.welcome-area .welcome-hero-mockup {
    position: relative;
    z-index: 2;
    max-width: 750px;
}

.welcome-area .shape-fullsection {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    height: 100vh;
    z-index: -1;
}

.welcome-area .shape-fullsection.showcase-header-pattern-bg .shape-one {
    position: absolute;
    bottom: 25rem;
    left: 60rem;
    width: 80rem;
    height: 35rem;
    border-radius: 17rem;
    transform: rotate(-45deg);
    opacity: .04;
    background-color: #714B67;
}

.welcome-area .shape-fullsection.showcase-header-pattern-bg .shape-two {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url(../img/bg/ball-wed-01.svg) no-repeat top center;
    background-size: 100% auto;
    opacity: .04;
    transform: scaleX(-1);
    -webkit-filter: FlipH;
    filter: FlipH;
}

.welcome-area .shape-fullsection .shape-radial {
    /*color: #e8dfff;*/color: #fff;
}

.welcome-area .shape-fullsection .shape-wave {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url(../img/bg/overlay-bg-curve.svg) no-repeat center top;
    background-size: 100% auto;
}

.welcome-area .shape-fullsection.bg-slider:before {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    content: '';
    background: rgba(60, 64, 77, 0.8);
    z-index: 0;
}

.welcome-area .shape-fullsection.bg-slider .swiper-container {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
}

.welcome-area .shape-fullsection.bg-slider .swiper-container .swiper-slide img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
}

.welcome-area .shape-fullsection.heroheaderparticles {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.welcome-area .shape-fullsection.heroheaderparticles:before {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    content: '';
    background: rgba(60, 64, 77, 0.8);
    z-index: 0;
}

.welcome-area .shape-fullsection.heroheaderparticles canvas {
    position: relative;
    z-index: 1;
}

.welcome-area .shape-fullsection.video-bg {
    background: url(http://via.placeholder.com/1920x1080/333333/fff) no-repeat center center;
    background-size: cover;
}

.welcome-area .shape-fullsection.video-bg:before {
    background: #03c;
    background: linear-gradient(45deg, #03c 0%, #8900cc 100%);
    opacity: 0.7;
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
}

.welcome-area .shape-fullsection.video-bg .video-background {
    position: absolute;
    right: 0;
    bottom: 0;
    min-width: 100%;
    min-height: 100%;
    z-index: 0;
}

.welcome-area .shape-fullsection.svg-animated-bg .shape-bg-one {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url(../img/bg/hero-bg.svg) no-repeat bottom center;
    background-size: 100% auto;
}

.welcome-area .shape-fullsection.svg-animated-bg .shape-bg-two {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url(../img/bg/ball-wed.svg) no-repeat top center;
    background-size: 100% auto;
    opacity: .1;
}

.welcome-area .shape-fullsection.shape-curve-with-spot {
    background-position: center bottom;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(../img/bg/shape-01.svg);
}

.welcome-area .shape-fullsection.shape-ios-bigsur {
    background-position: right bottom;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(../img/bg/shape-03.svg);
}

.welcome-area .shape-fullsection.shape-cube-large {
    background-position: center bottom;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(../img/bg/shape-02.svg);
}

.welcome-area .shape-fullsection.shape-cube-large .box-animation-01,
.welcome-area .shape-fullsection.shape-cube-large .box-animation-02 {
    position: absolute;
    z-index: 1;
    border-radius: 50px;
    transform: rotate(-12deg);
    background: rgba(200, 29, 207, 0.05);
    background: linear-gradient(0deg, rgba(200, 29, 207, 0.05) 0%, rgba(200, 29, 207, 0.4) 100%);
}

.welcome-area .shape-fullsection.shape-cube-large .box-animation-01 {
    width: 250px;
    height: 350px;
    right: 15%;
    top: 30%;
    -webkit-animation: rotateAnimation 15s infinite;
    animation: rotateAnimation 15s infinite;
}

.welcome-area .shape-fullsection.shape-cube-large .box-animation-02 {
    width: 230px;
    height: 280px;
    left: 20%;
    top: 20%;
    -webkit-animation: rotateAnimation 5s infinite;
    animation: rotateAnimation 5s infinite;
}

.welcome-area .shape-bottom {
    position: absolute;
    top: unset;
    left: 0;
    right: 0;
    bottom: -1px;
}

.welcome-area .shape-bottom svg {
    width: 100%;
    height: auto;
}

/* Inner Hero Header Style */
.inner-header-area.bg-overlay {
    position: relative;
}

.inner-header-area.bg-overlay:before {
    background: #03c;
    background: linear-gradient(45deg, #03c 0%, #8900cc 100%);
    opacity: 0.80;
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.inner-header-area .container {
    position: relative;
}

.inner-header-area .breadcrumb .breadcrumb-item {
    color: rgba(255, 255, 255, 0.8);
}

.inner-header-area .breadcrumb .breadcrumb-item + .breadcrumb-item:before {
    font-family: "Material Design Icons";
    color: rgba(255, 255, 255, 0.8);
    margin: 0 .45rem;
    content: '\F0142';
}

.inner-header-area .breadcrumb .breadcrumb-item a {
    color: #ffffff;
}

@-webkit-keyframes rotateAnimation {
    0% {
        transform: rotate(-12deg);
    }
    50% {
        transform: rotate(12deg);
    }
    100% {
        transform: rotate(-12deg);
    }
}

@keyframes rotateAnimation {
    0% {
        transform: rotate(-12deg);
    }
    50% {
        transform: rotate(12deg);
    }
    100% {
        transform: rotate(-12deg);
    }
}

/* --------------------------
  08. Welcome Section style
----------------------------- */
.card.card-different .icon {
    font-size: 3rem;
}

/* --------------------------
  09. How it Works style
----------------------------- */
.how-it-works-video {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.how-it-works-video .how-it-works-video-btn {
    position: absolute;
}

.how-it-works-process .how-it-work-process-item .how-it-work-step {
    margin-bottom: 1.5rem;
    position: relative;
}

.how-it-works-process .how-it-work-process-item .how-it-work-step a {
    width: 4.375rem;
    height: 4.375rem;
    border-radius: 50%;
    background: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
    color: #542D4B;
    box-shadow: 0 0 0 10px rgba(107, 109, 112, 0.5);
    position: relative;
    z-index: 1;
    transition: all 0.3s ease;
}

.how-it-works-process .how-it-work-process-item .how-it-work-step a .icon {
    font-size: 2.15rem;
}

.how-it-works-process .how-it-work-process-item .how-it-work-step a:hover {
    animation: imgJump 2s linear infinite;
    background: #542D4B;
    color: #ffffff;
}

.how-it-works-process .how-it-work-process-item.active .how-it-work-step a {
    background: #542D4B;
    color: #ffffff;
}

/* --------------------------
  10. Screenshots style
----------------------------- */
.screenshots-slider .swiper-slide {
    width: 300px;
    height: auto;
    padding: 0 15px;
}

.screenshots-slider .swiper-slide img {
    width: 100%;
    display: block;
}

.screenshots-slider .swiper-slide .overlay-bg {
    position: relative;
    border-radius: 5px;
    overflow: hidden;
    box-shadow: 0px 0.625rem 1.25rem rgba(107, 109, 112, 0.1);
    -webkit-box-shadow: 0px 0.625rem 1.25rem rgba(107, 109, 112, 0.1);
    margin-top: 2rem;
    margin-bottom: 2rem;
    background: #ffffff;
}

.screenshots-slider .swiper-slide .overlay-bg:before {
    position: absolute;
    content: "";
    opacity: 0;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #714b67;
    background: linear-gradient(150deg, #714b67 0%, #542d4b 100%);
    transition: all 0.3s ease;
}

.screenshots-slider .swiper-slide .overlay-bg .screenshots-icon {
    position: absolute;
    z-index: 3;
    left: 50%;
    top: 50%;
    color: #ffffff;
    font-size: 2rem;
    background: rgba(255, 255, 255, 0.3);
    opacity: 0;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 4.375rem;
    height: 4.375rem;
    border-radius: 2.1875rem;
    transform: translate(-50%, -10%);
}

.screenshots-slider .swiper-slide.swiper-slide-active .overlay-bg:hover:before {
    opacity: .8;
}

.screenshots-slider .swiper-slide.swiper-slide-active .overlay-bg:hover .screenshots-icon {
    transform: translate(-50%, -50%);
    opacity: 1;
}

.screenshots-slider .swiper-pagination {
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.screenshots-slider .swiper-pagination .swiper-pagination-bullet {
    border: 2px solid #714B67;
    opacity: 1;
    background: #ffffff;
    background: linear-gradient(0deg, #ffffff 0%, #ffffff 100%);
    transition: all 0.3s ease;
    width: 1rem;
    height: 1rem;
    border-radius: 0.5rem;
}

.screenshots-slider .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    border-width: 0;
    background: #714b67;
    background: linear-gradient(150deg, #714b67 0%, #542d4b 100%);
}

/* --------------------------
  11. Pricing style
----------------------------- */
.section-pricing .pricing-pills .nav-pills {
    border: 2px solid #714B67;
    border-radius: 5px;
    box-shadow: 0px 10px 20px rgba(107, 109, 112, 0.1);
    overflow: hidden;
}

.section-pricing .pricing-pills .nav-pills .nav-item .nav-link {
    text-transform: uppercase;
    font-size: 1rem;
    font-weight: 600;
    padding-left: 2.125rem;
    padding-right: 2.125rem;
    min-height: 3.125rem;
    border-radius: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    letter-spacing: .5px;
}

.section-pricing .pricing-pills .nav-pills .nav-item .nav-link:not(.active) {
    color: #714B67;
}

.section-pricing .pricing-pills .nav-pills .nav-item .nav-link:not(.active):hover {
    background-color: #e6ecff;
}

.section-pricing .card.card-pricing .card-header {
    background: #ffffff;
    border-color: #F5F5F5;
    padding: 1.5rem 1.875rem;
}

.section-pricing .card.card-pricing .card-header h4 {
    color: #707070;
    font-weight: 600;
    margin-bottom: .2rem;
}

.section-pricing .card.card-pricing .card-header h2 {
    margin-bottom: 0;
}

.section-pricing .card.card-pricing .card-header h2 small {
    font-size: 1.25rem;
    bottom: 4px;
    position: relative;
}

.section-pricing .card.card-pricing .card-header .icon {
    font-size: 2rem;
    color: #714B67;
}

.section-pricing .card.card-pricing .card-body {
    padding: 1.5rem 1.875rem;
}

.section-pricing .card.card-pricing .card-body .pricing-available-option {
    margin-bottom: 0;
}

.section-pricing .card.card-pricing .card-body .pricing-available-option li {
    padding: .8rem 2rem .8rem 0;
    color: #707070;
    position: relative;
}

.section-pricing .card.card-pricing .card-body .pricing-available-option li:after {
    content: '';
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "Material Design Icons";
    font-size: 1.3rem;
}

.section-pricing .card.card-pricing .card-body .pricing-available-option li.available:after {
    content: '\F012C';
    color: #2BD865;
}

.section-pricing .card.card-pricing .card-body .pricing-available-option li.not-available:after {
    content: '\F0156';
    color: #EE5050;
}

.section-pricing .card.card-pricing .card-footer {
    padding: 1.875rem;
    background: #ffffff;
    border-color: #F5F5F5;
}

.section-pricing .card.card-pricing .card-footer .btn .icon {
    margin-right: .5rem;
}

.section-pricing .card.card-pricing.active {
    background: #714B67;
}

.section-pricing .card.card-pricing.active.shadow {
    box-shadow: 0 0 0 0.2rem rgba(107, 109, 112, 0.8);
!important;
}

.section-pricing .card.card-pricing.active .card-header {
    background: #714B67;
    border-color: rgba(245, 245, 245, 0.2);
}

.section-pricing .card.card-pricing.active .card-header h4,
.section-pricing .card.card-pricing.active .card-header h2,
.section-pricing .card.card-pricing.active .card-header .icon {
    color: #ffffff;
}

.section-pricing .card.card-pricing.active .card-body {
    padding: 1.5rem 1.875rem;
}

.section-pricing .card.card-pricing.active .card-body .pricing-available-option {
    margin-bottom: 0;
}

.section-pricing .card.card-pricing.active .card-body .pricing-available-option li {
    color: #ffffff;
}

.section-pricing .card.card-pricing.active .card-body .pricing-available-option li:after, .section-pricing .card.card-pricing.active .card-body .pricing-available-option li:before {
    color: #ffffff;
}

.section-pricing .card.card-pricing.active .card-footer {
    background: #714B67;
    border-color: rgba(245, 245, 245, 0.2);
}

.section-pricing .card.card-pricing.active .card-footer .btn {
    background: #ffffff;
    color: #714B67;
}

.section-pricing .card.card-pricing.active .card-footer .btn:hover {
    background-color: #e6ecff;
}

/* --------------------------
  12. Clients style
----------------------------- */
.swiper-clients-container {
    padding-bottom: 2rem;
}

.swiper-clients-container .swiper-slide {
    padding-bottom: 2rem;
}

.swiper-clients-container .swiper-pagination {
    bottom: 0;
}

.swiper-clients-container .swiper-pagination .swiper-pagination-bullet {
    background: #ffffff;
    transition: all 0.3s ease;
    width: 12px;
    height: 12px;
    border-radius: 6px;
}

.swiper-clients-container .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    width: 36px;
}

.card.card-clients {
    position: relative;
    border: none;
    box-shadow: 0px 10px 20px rgba(0, 44, 176, 0.2) !important;
}

.card.card-clients:before {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: -0.8rem;
    content: '';
    width: 80%;
    left: 10%;
    background: #ffffff;
    z-index: -1;
    border-radius: 10px;
    box-shadow: 0px 10px 20px rgba(0, 44, 176, 0.2);
}

.card.card-clients .card-body {
    padding: 1.875rem;
}

.card.card-clients .card-body .user-details {
    display: flex;
    align-items: center;
}

.card.card-clients .card-body .user-details .user-img {
    flex: 0 0 5.625rem;
    margin-right: 1rem;
}

.card.card-clients .card-body .user-details .user-img img {
    width: 5.625rem;
    height: 5.625rem;
    border-radius: 5px;
}

.card.card-clients .card-body .user-details .user-info h4 {
    margin: 0;
}

.card.card-clients .card-body .user-details .user-info p {
    margin: 0 0 .4rem;
}

.card.card-clients .card-body .user-details .user-info .star {
    font-size: 1rem;
    color: #542D4B;
}

.card.card-clients .card-body .user-details .user-info .news-share a {
    font-size: 1rem;
}

.card.card-clients .card-body .user-details .user-info .news-share a + a {
    margin-left: 1rem;
}

.statistics {
    margin-top: 2rem;
}

.statistics .statistic .icon {
    font-size: 2.5rem;
    margin-left: auto;
    margin-right: auto;
    color: #ffffff;
    position: relative;
    margin-bottom: 1.5rem;
    background: #9a0670;
    width: 5.625rem;
    height: 5.625rem;
    border-radius: 2.8125rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.statistics .statistic .icon:before {
    animation: iconPulse 1.5s linear infinite;
    content: "";
    display: block;
    position: absolute;
    border: 1px solid #ffffff;
    border-radius: 50%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.statistics .statistic h2 {
    color: #ffffff;
    margin-bottom: 0;
}

.statistics .statistic p {
    margin: 0;
    color: #8F8F8F;
}

/* --------------------------
  13. Our team style
----------------------------- */
.card.card-team {
    transition: all 0.3s ease;
    top: 0;
}

.card.card-team .team-member-image img {
    width: 100%;
    height: auto;
}

.card.card-team .card-body {
    position: absolute;
    top: 35%;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    padding: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    flex-direction: column;
    background: rgba(107, 109, 112, 0.9);
}

.card.card-team .card-body .team-member-text {
    text-align: center;
}

.card.card-team .card-body .team-member-text h4 {
    color: #ffffff;
    margin: 0;
}

.card.card-team .card-body .team-member-text p {
    color: #8F8F8F;
}

.card.card-team .card-body .team-member-social {
    margin-top: .7rem;
    display: flex;
    align-items: center;
    justify-content: center;
}

.card.card-team .card-body .team-member-social a {
    display: block;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    width: 44px;
    height: 44px;
    margin: 0 .2rem;
    color: #8F8F8F;
    background: rgba(107, 109, 112, 0.1);
    border-radius: 5px;
}

.card.card-team .card-body .team-member-social a:hover {
    background: rgba(107, 109, 112, 0.9);
    color: #ffffff;
}

.card.card-team:hover {
    box-shadow: 0px 0.625rem 1.25rem rgba(107, 109, 112, 0.3) !important;
    -webkit-box-shadow: 0 0 0 0.2rem rgba(107, 109, 112, 0.8);
    top: -4px;
}

.card.card-team:hover .card-body {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 1;
}

/* --------------------------
  14. Newsletter style
----------------------------- */
.card.card-news {
    transition: all 0.3s ease;
    top: 0;
}

.card.card-news .news-image {
    position: relative;
    border-radius: 10px;
    overflow: hidden;
}

.card.card-news .news-image img {
    width: 100%;
}

.card.card-news .news-image .news-overlay {
    position: absolute;
    opacity: 0;
    top: 35%;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(107, 109, 112, 0.9);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.card.card-news .news-image .news-overlay .btn {
    color: #ffffff;
    font-size: 1.5rem;
    width: 50px;
    height: 44px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.card.card-news .card-body {
    padding: 1.875rem;
}

.card.card-news .card-body .news-posted-by {
    display: flex;
    align-items: center;
    margin-top: 1.5rem;
}

.card.card-news .card-body .news-posted-by .user-img {
    flex: 0 0 5.625rem;
    margin-right: 1rem;
}

.card.card-news .card-body .news-posted-by .user-img img {
    width: 5.625rem;
    height: 5.625rem;
    border-radius: 5px;
}

.card.card-news .card-body .news-posted-by .user-info h4 {
    margin: 0;
}

.card.card-news .card-body .news-posted-by .user-info p {
    margin: 0 0 .4rem;
}

.card.card-news .card-body .news-posted-by .user-info .star {
    font-size: 1rem;
    color: #542D4B;
}

.card.card-news .card-body .news-posted-by .user-info .news-share a {
    font-size: 1rem;
}

.card.card-news .card-body .news-posted-by .user-info .news-share a + a {
    margin-left: 1rem;
}

.card.card-news:hover {
    box-shadow: 0px 0.625rem 1.25rem rgba(107, 109, 112, 0.3) !important;
    -webkit-box-shadow: 0 0 0 0.2rem rgba(107, 109, 112, 0.8);
    top: -4px;
}

.card.card-news:hover .news-overlay {
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 1;
}

.app-rating h2 {
    margin: 0;
    color: #ffffff !important;
}

.app-rating .icon {
    font-size: 1.8rem;
}

.app-rating .total-download {
    background: #0040ff;
    font-size: 1rem;
    padding: .3rem 1rem;
    color: #ffffff;
    border-radius: 5px;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
}

/* --------------------------
  15. Subscribe style
----------------------------- */
.subscribe-input-group {
    box-shadow: 0px 0.625rem 1.25rem rgba(107, 109, 112, 0.1);
    -webkit-box-shadow: 0px 0.625rem 1.25rem rgba(107, 109, 112, 0.1);
    transition: all 0.3s ease;
    border-radius: 5px;
    border: 2px solid #714B67;
    overflow: hidden;
}

.subscribe-input-group .form-control {
    border: none;
    height: calc(4rem - 4px);
    padding: 0 1.875rem;
    box-shadow: none;
}

.subscribe-input-group .btn {
    padding: 0 3rem;
}

.subscribe-input-group .btn:hover {
    top: 0;
}

.subscribe-input-group:hover, .subscribe-input-group:active, .subscribe-input-group.focused {
    box-shadow: 0px 0.625rem 1.25rem rgba(107, 109, 112, 0.3) !important;
    -webkit-box-shadow: 0 0 0 0.2rem rgba(107, 109, 112, 0.8);
}

/* --------------------------
  16. FAQ's style
----------------------------- */
.faq-questions {
    counter-reset: myitemcounter;
}

.faq-questions .card {
    background: none;
    border: none;
}

.faq-questions .card .card-header {
    border: none;
    background: #ffffff;
    border-radius: 5px;
    box-shadow: 0px 0.625rem 1.25rem rgba(107, 109, 112, 0.1);
    -webkit-box-shadow: 0px 0.625rem 1.25rem rgba(107, 109, 112, 0.1);
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    padding: .625rem;
    cursor: pointer;
    font-weight: 600;
}

.faq-questions .card .card-header:before {
    counter-increment: myitemcounter;
    content: counters(myitemcounter, ".") ".";
    margin: 0 1rem;
}

.faq-questions .card .card-header .number {
    flex: 0 0 2.75rem;
    text-align: center;
}

.faq-questions .card .card-header .title {
    font-family: "Poppins", sans-serif;
    flex: 1 1 auto;
}

.faq-questions .card .card-header .icon {
    border-radius: 5px;
    display: block;
    flex: 0 0 2.75rem;
    width: 2.75rem;
    height: 2.75rem;
    position: relative;
    background: rgba(217, 225, 252, 0.1);
}

.faq-questions .card .card-header .icon:before, .faq-questions .card .card-header .icon:after {
    border-radius: 2px;
    position: absolute;
    content: "";
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) rotate(0deg);
    background: #714B67;
    transition: all 0.3s ease;
    width: 1rem;
    height: 0.25rem;
}

.faq-questions .card .card-header .icon:after {
    transform: translate(-50%, -50%) rotate(-90deg);
}

.faq-questions .card .card-header[aria-expanded="false"]:hover {
    box-shadow: 0px 0.625rem 1.25rem rgba(107, 109, 112, 0.3) !important;
    -webkit-box-shadow: 0 0 0 0.2rem rgba(107, 109, 112, 0.8);
}

.faq-questions .card .card-header[aria-expanded="true"] {
    background: #714B67;
    color: #ffffff;
}

.faq-questions .card .card-header[aria-expanded="true"] .icon {
    background: #ffffff;
}

.faq-questions .card .card-header[aria-expanded="true"] .icon:before {
    transform: translate(-50%, -50%) rotate(180deg);
}

.faq-questions .card .card-header[aria-expanded="true"] .icon:after {
    transform: translate(-50%, -50%) rotate(0deg);
}

.faq-questions .card .card-body {
    color: #707070;
    font-size: 1rem;
    line-height: 2rem;
}

.faq-questions .card .card-body strong {
    font-weight: 600;
}

.faq-questions .card .card-body p {
    font-size: 1rem;
}

.faq-questions .card + .card {
    margin-top: 1rem;
}

/* --------------------------
  17. FAQ's Form style
----------------------------- */
.ask-questions .form-group .input-group {
    background: #ffffff;
    border-radius: 5px;
    box-shadow: 0px 0.625rem 1.25rem rgba(107, 109, 112, 0.1);
    -webkit-box-shadow: 0px 0.625rem 1.25rem rgba(107, 109, 112, 0.1);
    transition: all 0.3s ease;
}

.ask-questions .form-group .input-group .input-group-prepend .input-group-text {
    border: none;
    background: none;
    font-size: 1.5rem;
    padding-left: 1.5rem;
    padding-right: 1rem;
    color: #8F8F8F;
}

.ask-questions .form-group .input-group.focused {
    box-shadow: 0px 0.625rem 1.25rem rgba(107, 109, 112, 0.3) !important;
    -webkit-box-shadow: 0 0 0 0.2rem rgba(107, 109, 112, 0.8);
}

.ask-questions .form-group .form-control {
    min-height: 4rem;
    border: none;
    border-radius: 5px;
    resize: none;
    box-shadow: none;
}

.ask-questions .form-group textarea.form-control {
    height: 16.5rem;
    padding: 1.5rem 1.875rem;
}

/* --------------------------
  18. Coming Soon style
----------------------------- */
.section.coming-soon {
    min-height: 100vh;
}

.section.coming-soon.bg-overlay {
    position: relative;
}

.section.coming-soon.bg-overlay:before {
    background: #03c;
    background: linear-gradient(45deg, #03c 0%, #8900cc 100%);
    opacity: 0.80;
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.section.coming-soon.bg-overlay:after {
    background: url(../img/bg/overlay.png) repeat;
    position: absolute;
    content: "";
    z-index: 1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.section.coming-soon .container {
    z-index: 2;
}

.section.coming-soon .logo {
    font-size: 3rem;
    color: #ffffff;
    font-weight: 300;
}

.section.coming-soon .logo img {
    margin: 0 1rem;
    height: 3.4rem;
}

.section .is-countdown .countdown-row {
    display: flex;
    align-items: center;
    justify-content: center;
}

.section .is-countdown .countdown-row .countdown-section {
    flex: 1 1 auto;
}

.section .is-countdown .countdown-row .countdown-section:not(:first-child) {
    border-left: 1px solid rgba(255, 255, 255, 0.3);
}

.section .is-countdown .countdown-row .countdown-section > span {
    display: block;
    color: #ffffff;
    line-height: 1.5;
}

.section .is-countdown .countdown-row .countdown-section > span.countdown-amount {
    font-size: 4rem;
    font-weight: 300;
}

.section .is-countdown .countdown-row .countdown-section > span.countdown-period {
    font-weight: 300;
    letter-spacing: 1px;
    text-transform: uppercase;
}

/* --------------------------

  19. Page Not Found style
----------------------------- */
.section.page-not-found {
    min-height: 100vh;
}

.section.page-not-found.bg-overlay {
    position: relative;
}

.section.page-not-found.bg-overlay:before {
    background: #03c;
    background: linear-gradient(45deg, #03c 0%, #8900cc 100%);
    opacity: 0.80;
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

/* --------------------------

  20. Pagination style
----------------------------- */
.pagination {
    margin-left: -5px;
    margin-right: -5px;
}

.pagination > .page-item {
    margin: 0 5px;
}

.pagination > .page-item > .page-link {
    font-size: 14px;
    height: 40px;
    width: 40px;
    line-height: 40px;
    padding: 0;
    display: inline-block;
    border: 1px solid #3C404D;
    text-align: center;
    transition: all 0.3s ease;
}

.pagination > .page-item > .page-link .icon {
    transition: all 0.3s ease;
    position: relative;
    transform: translate(0, 0);
    display: block;
}

.pagination > .page-item:not(.active) .page-link {
    color: #3C404D;
}

.pagination > .page-item:not(.active) .page-link:hover {
    color: #714B67;
}

.pagination > .page-item:first-child .page-link, .pagination > .page-item:last-child .page-link {
    border-radius: 0;
    border-color: transparent;
    font-size: 20px;
}

.pagination > .page-item:first-child .page-link:hover {
    background: transparent;
}

.pagination > .page-item:first-child .page-link:hover .icon {
    transform: translate(-5px, 0);
}

.pagination > .page-item:last-child .page-link:hover {
    background: transparent;
}

.pagination > .page-item:last-child .page-link:hover .icon {
    transform: translate(5px, 0);
}

/* --------------------------
  21. Blog style
----------------------------- */
.blog-card {
    cursor: pointer;
    transition: all 0.3s ease;
    position: relative;
    top: 0;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}

.blog-card:hover {
    box-shadow: 0px 10px 20px rgba(107, 109, 112, 0.1);
    top: -4px;
}

.blog-card .blog-thumb {
    position: relative;
}

.blog-card .blog-thumb img {
    display: block;
    border-radius: 10px;
}

.blog-card .blog-thumb .blog-thumb-hover {
    border-radius: 10px;
    overflow: hidden;
    position: relative;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    top: 100px;
    opacity: 0;
    visibility: hidden;
}

.blog-card .blog-thumb .blog-thumb-hover:before {
    background: #03c;
    background: linear-gradient(45deg, #03c 0%, #8900cc 100%);
    opacity: 0.80;
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.blog-card .blog-thumb .blog-thumb-hover .icon {
    background-color: rgba(255, 255, 255, 0.1);
    padding: 1.125rem 1.125rem;
    position: relative;
    z-index: 2;
    color: #ffffff;
    border-radius: 3.3333333333px;
    font-size: 20px;
    top: 20px;
    transition: all 1s ease;
}

.blog-card .blog-thumb:hover .blog-thumb-hover {
    top: 0;
    visibility: visible;
    opacity: 1;
}

.blog-card .blog-thumb:hover .blog-thumb-hover .icon {
    top: 0;
}

.blog-card .card-body a {
    transition: all 0.3s ease;
}

.blog-card .card-body a:not(:hover) {
    color: #343a40;
}

.blog-card .card-body p {
    font-size: 1rem;
    color: #6c757d;
}

.blog-card .card-body .blog-meta-info {
    margin-bottom: 1rem;
}

.blog-card .card-body .blog-meta-info .posted-time {
    font-weight: 600;
}

.blog-card .card-body .blog-meta-info a:not(:hover) {
    color: #6c757d;
}

.blog-card .card-body .blog-title {
    margin-bottom: 1rem;
}

.blog-card .card-body .blog-read-more-btn {
    position: relative;
    font-weight: 400;
}

.blog-card .card-body .blog-read-more-btn:after {
    transition: all 0.3s ease;
    padding-left: 1rem;
    position: absolute;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    font-family: "Material Design Icons";
    content: "\F0054";
    top: 50%;
    right: 10px;
    transform: translate(0, -47%);
    opacity: 0;
}

.blog-card .card-body .blog-read-more-btn:hover:after {
    right: -20px;
    opacity: 1;
}

/* --------------------------
20.01. Blog Sidebar style
----------------------------- */
.card-search-widget {
    position: relative;
    border-color: #f0f1f4;
    border-radius: 5px;
}

.card-search-widget .input-group {
    background: #ffffff;
    border-radius: 5px;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
    transition: all 0.3s ease;
}

.card-search-widget .input-group .input-group-prepend .input-group-text {
    border: none;
    background: none;
    font-size: 1.5rem;
    padding-left: 1rem;
    padding-right: 1rem;
    color: #8F8F8F;
    padding-top: 0;
    padding-bottom: 0;
}

.card-search-widget .input-group.focused {
    box-shadow: 0px 0.625rem 1.25rem rgba(107, 109, 112, 0.3) !important;
    -webkit-box-shadow: 0 0 0 0.2rem rgba(107, 109, 112, 0.8);
}

.card-search-widget .input-group .form-control {
    min-height: 3rem;
    padding-left: 0;
    border: none;
    border-radius: 5px;
    resize: none;
    box-shadow: none;
}

.card-blog-widget {
    background: #ffffff;
    border-radius: 5px;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
    transition: all 0.3s ease;
    border-color: #f0f1f4;
    overflow: hidden;
}

.card-blog-widget .card-header {
    border-radius: 5px 5px 0 0;
    background: #ffffff;
    border-color: #f0f1f4;
    text-transform: uppercase;
    padding-top: 1rem;
    padding-bottom: 1rem;
    cursor: pointer;
}

.card-blog-widget .card-header.collapsed {
    border-radius: 5px;
    border: none;
}

.card-blog-widget .post-widgets .post-widget {
    display: flex;
    flex-wrap: nowrap;
    padding: 1rem 1.25rem;
    background: #ffffff;
    transition: all 0.3s ease;
}

.card-blog-widget .post-widgets .post-widget:hover {
    background: #f5f7ff;
}

.card-blog-widget .post-widgets .post-widget + .post-widget {
    border-top: 1px solid #f0f1f4;
}

.card-blog-widget .post-widgets .post-widget .widget-post-thumb {
    min-width: 4rem;
    height: 4rem;
}

.card-blog-widget .post-widgets .post-widget .widget-post-thumb img {
    width: 4rem;
    height: 4rem;
    -o-object-fit: cover;
    object-fit: cover;
}

.card-blog-widget .post-widgets .post-widget .post-widget-content {
    margin-left: 1rem;
}

.card-blog-widget .post-widgets .post-widget .post-widget-content p {
    margin: 0 0 .3rem;
    font-size: .8rem;
}

.card-blog-widget .post-widgets .post-widget .post-widget-content h6 {
    margin: 0;
}

.card-blog-widget .tags {
    display: inline-flex;
    gap: 5px;
    flex-wrap: wrap;
    padding-top: 1rem;
}

.card-blog-widget .tags a {
    border: 1px solid #f0f1f4;
    padding: .2rem 1rem;
    color: #3C404D;
    font-size: .8rem;
    border-radius: 3px;
    transition: all 0.3s ease;
    background-color: #ffffff;
}

.card-blog-widget .tags a:hover {
    background: #f5f7ff;
    color: #714B67;
}

.card-blog-widget .post-category-list li + li {
    border-top: 1px solid #f0f1f4;
}

.card-blog-widget .post-category-list li a {
    background: #ffffff;
    transition: all 0.3s ease;
    padding: .7rem 1.25rem;
    color: #3C404D;
}

.card-blog-widget .post-category-list li a:hover {
    background: #f5f7ff;
    color: #714B67;
}

.card-blog-widget .post-category-list li.active a {
    background: #f5f7ff;
    color: #714B67;
}

/* --------------------------
20.02. Single Blog style
----------------------------- */
.single-blog-card .blog-img img {
    display: block;
    border-radius: 10px;
}

.single-blog-card a,
.single-blog-card .icon {
    transition: all 0.3s ease;
}

.single-blog-card a:not(:hover),
.single-blog-card .icon:not(:hover) {
    color: #3C404D;
}

.single-blog-card a:not(:hover) .icon,
.single-blog-card .icon:not(:hover) .icon {
    color: #838a9f;
}

.single-blog-card .blog-meta-info .meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.single-blog-card .blog-meta-info .meta .devider {
    width: 6px;
    height: 6px;
    margin-left: 1rem;
    margin-right: 1rem;
    background-color: #bdc0cb;
    border-radius: 50%;
}

.single-blog-card .card-body p {
    font-size: 1rem;
    line-height: 1.8rem;
}

.single-blog-card .card-body ul.blog-list {
    list-style: none;
    margin-left: 0;
    padding-left: 1.5rem;
}

.single-blog-card .card-body ul.blog-list li {
    position: relative;
    padding-left: 1.5rem;
    color: #697086;
}

.single-blog-card .card-body ul.blog-list li:before {
    background: #714B67;
    content: "";
    height: 8px;
    left: 0;
    position: absolute;
    top: 8px;
    width: 8px;
    border-radius: 100%;
}

@media (min-width: 992px) {
    .single-blog-card .card-body ul.blog-list li {
        line-height: 2.2rem;
    }

    .single-blog-card .card-body ul.blog-list li:before {
        top: 13px;
    }
}

.single-blog-card .card-body blockquote, .single-blog-card .card-body .share-single-post-wrapper {
    background-color: #f6f6f8;
    border-radius: 5px;
    display: block;
    padding: 1rem 1.5rem;
    margin-left: 2rem;
}

.single-blog-card .card-body blockquote p, .single-blog-card .card-body .share-single-post-wrapper p {
    color: #3C404D;
}

.single-blog-card .card-body blockquote p:last-child, .single-blog-card .card-body .share-single-post-wrapper p:last-child {
    margin: 0;
}

.single-blog-card .card-body .share-single-post-wrapper {
    margin-left: 0;
    margin-bottom: 0;
}

.single-blog-card .card-body .share-single-post-wrapper .post-tags span {
    font-weight: 600;
}

.single-blog-card .card-body .share-single-post-wrapper .post-tags a {
    margin-left: .5rem;
}

.single-blog-card .card-body .share-single-post-wrapper .post-tags a:not(:hover) {
    color: #697086;
}

.single-blog-card .card-body .share-single-post-wrapper .social-share span {
    font-weight: 600;
}

.single-blog-card .card-body .share-single-post-wrapper .social-share .btn {
    padding: .2rem .7rem;
    border: none;
    margin-left: .2rem;
}

.single-blog-card .card-body .share-single-post-wrapper .social-share .btn i {
    transition: all 0.3s ease;
}

.single-blog-card .card-body .share-single-post-wrapper .social-share .btn:hover i {
    color: #ffffff !important;
}

.media-list-wrapper {
    margin-bottom: 3rem;
}

.media-list-wrapper .comment-title {
    margin-top: 2rem;
    margin-bottom: 2rem;
}

.media-list-wrapper .media img {
    width: 4rem;
    height: 4rem;
    border-radius: 2rem;
}

@media (min-width: 992px) {
    .media-list-wrapper .media img {
        width: 7rem;
        height: 7rem;
        border-radius: 3.5rem;
    }
}

.media-list-wrapper .media .media-body {
    border-bottom: 1px solid rgba(60, 64, 77, 0.1);
}

.media-list-wrapper .media .media-body .comment-author-info h5 {
    margin: 0 0 .3rem;
}

.media-list-wrapper .media .media-body .comment-author-info p {
    font-size: 1rem;
}

.media-list-wrapper .media .media-body p {
    font-size: 1rem;
}

.media-list-wrapper .media .media-body .comment-action {
    margin: 0 0 1.5rem;
    padding: 0;
    list-style: none;
    display: flex;
    align-items: center;
}

.media-list-wrapper .media .media-body .comment-action li a {
    font-size: .9rem;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
}

.media-list-wrapper .media .media-body .comment-action li a:not(:hover) {
    color: #697086;
}

.media-list-wrapper .media .media-body .comment-action li a i {
    margin-left: .5rem;
}

.media-list-wrapper .media .media-body .comment-action li + li {
    margin-left: 1.5rem;
}

.media-list-wrapper .media.media-replay {
    margin-left: 2.5rem;
}

@media (min-width: 992px) {
    .media-list-wrapper .media.media-replay {
        margin-left: 5rem;
    }
}

/* --------------------------
  22. Login Register style
----------------------------- */
/* Card login Styling */
.card-login-signup {
    position: relative;
    z-index: 99;
}

.card-login-signup p {
    font-size: 1rem;
}

.card-login-signup .login-or-signup-with .btn-sm {
    min-width: 34px;
}

/* --------------------------
  23. Parallax background image style
----------------------------- */
@media (max-width: 991px) {
    /* -- Testimonial --*/
    .parallax-testimonial {
        background-image: url(../img/bg/clients.svg);
    }

    /* -- Download App --*/
    .parallax-download-app {
        background-image: url(../img/bg/download.svg);
    }

    /* -- Download App --*/
    .parallax-map {
        background-image: url(http://via.placeholder.com/1920x1080/fff/ccc);
    }
}

/* --------------------------
  24. Swiper Custom style
----------------------------- */
#bannerCarousel .swiper-pagination .swiper-pagination-bullet {
    transition: all 0.3s ease;
    width: 20px;
    border-radius: 10px;
    height: 5px;
}

#bannerCarousel .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    width: 40px;
    background-color: #714B67;
}

/* --------------------------
  25. Footer style
----------------------------- */
.footer {
    background: rgb(40, 47, 51);
}

.footer .footer-item .logo {
    margin-bottom: 1.5rem;
}

.footer .footer-item p {
    color: #8F8F8F;
}

.footer .footer-item .footer-social-links {
    display: flex;
    align-items: center;
}

.footer .footer-item .footer-social-links a {
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    flex: 0 0 2.75rem;
    background: #272f4a;
    color: #ffffff;
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
    position: relative;
    top: 0;
}

.footer .footer-item .footer-social-links a + a {
    margin-left: .3rem;
}

.footer .footer-item .footer-social-links a:hover {
    background: #2e3857;
    box-shadow: 0px 10px 20px rgba(107, 109, 112, 0.1);
    top: -2px;
}

.footer .footer-item .footer-title {
    color: #ffffff;
    font-weight: 600;
    position: relative;
    padding-bottom: .8rem;
    margin-bottom: 1rem;
}

.footer .footer-item .footer-title:before {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 2px;
    border-radius: 2px;
    width: 90px;
    content: "";
    background: #542D4B;
}

.footer .footer-item .footer-links {
    margin: 0;
}

.footer .footer-item .footer-links li {
    position: relative;
    padding: .4rem 0;
}

.footer .footer-item .footer-links li:before {
    content: "\F0142";
    font-family: "Material Design Icons";
    color: #8F8F8F;
    margin-right: .5rem;
}

.footer .footer-item .footer-links li a {
    color: #8F8F8F;
    transition: all 0.3s ease;
}

.footer .footer-item .footer-links li a:hover {
    color: #f5cb76;
}

.footer .footer-item .contact-info-footer {
    margin: 0;
}

.footer .footer-item .contact-info-footer li {
    padding: .5rem 0;
    color: #8F8F8F;
}

.footer .footer-item .contact-info-footer li i {
    margin-right: .8rem;
}

.footer .footer-item .contact-info-footer li a {
    color: #542D4B;
    transition: all 0.3s ease;
}

.footer .footer-item .contact-info-footer li a:hover {
    color: #f9dda5;
}

.footer .footer-bottom {
    background: rgb(33, 39, 43);
    padding: 1rem 0;
}

.footer .footer-bottom .copy-right-info p {
    margin: 0;
    font-size: 1rem;
    color: rgb(249, 249, 249);
}

.footer .footer-bottom .copy-right-info p a {
    color: rgb(249, 249, 249);
    margin-left: .5rem;
    transition: all 0.3s ease;
    font-weight: 600;
}

.footer .footer-bottom .copy-right-info p a:hover {
    color: #f5cb76;
}

.footer .footer-bottom .footer-menu {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: 0;
}

.footer .footer-bottom .footer-menu a {
    padding: 0 1rem;
    color: #8F8F8F;
    transition: all 0.3s ease;
}

.footer .footer-bottom .footer-menu a:hover {
    color: #f5cb76;
}


/* --------------------------
  footer alternativo
----------------------------- */
.single-footer-widget .footer-social {
    padding-left: 0;
    margin-bottom: 0;
    margin-top: 20px;
}

.single-footer-widget .footer-social li {
    display: inline-block;
    margin-right: 10px;
}

.single-footer-widget .footer-social li:last-child {
    margin-right: 0;
}

.single-footer-widget .footer-social i {
    display: inline-block;
    height: 35px;
    width: 35px;
    line-height: 35px;
    background-color: #ffffff;
    border: 1px solid #ffffff;
    border-radius: 50px;
    color: #93b7be;
    -webkit-transition: 0.4s;
    transition: 0.4s;
    text-align: center;
}

.single-footer-widget .footer-social i::before {
    font-size: 15px;
}

.single-footer-widget .footer-social i:hover {
    background-color: #93b7be;
    color: #ffffff;
    border: 1px solid #93b7be;
}

.single-footer-widget p {
    font-size: 15px;
    color: #ececec;
    font-weight: 400;
}

.single-footer-widget .footer-heading {
    margin-bottom: 25px;
}

.single-footer-widget .footer-heading h3 {
    font-size: 20px;
    color: #ffffff;
    font-weight: 700;
    margin: 0 0 0 0;
    line-height: 2.5em;
}

.single-footer-widget .footer-quick-links {
    padding-left: 0;
    margin-bottom: 0;
}

.single-footer-widget .footer-quick-links li {
    list-style-type: none;
    padding-bottom: 18px;
}

.single-footer-widget .footer-quick-links li:last-child {
    padding-bottom: 0;
}

.single-footer-widget .footer-quick-links li a {
    display: inline-block;
    color: #ececec;
    font-size: 15px;
    font-weight: 400;
}

.single-footer-widget .footer-quick-links li a:hover {
    color: #93b7be;
    text-decoration: underline !important;
    -webkit-transition: 0.4s;
    transition: 0.4s;
}

.single-footer-widget .footer-info-contact {
    position: relative;
    padding-left: 35px;
    margin-bottom: 16px;
}

.single-footer-widget .footer-info-contact:last-child {
    margin-bottom: 0;
}

.single-footer-widget .footer-info-contact i {
    color: #ffffff;
    position: absolute;
    left: 0;
    top: 0px;
}

.single-footer-widget .footer-info-contact i::before {
    font-size: 20px;
}

.single-footer-widget .footer-info-contact h3 {
    font-size: 16px;
    color: #fff;
    font-weight: 600;
    margin: 0 0 10px 0;
}

.single-footer-widget .footer-info-contact span {
    font-size: 15px;
    color: #ececec;
    font-weight: 400;
}

.single-footer-widget .footer-info-contact span a {
    font-size: 15px;
    color: #ececec;
    font-weight: 400;
    -webkit-transition: 0.4s;
    transition: 0.4s;
}

.single-footer-widget .footer-info-contact span a:hover {
    color: #93b7be;
}
.footer-heading h3 {
    border-bottom: 1px solid #777;
}

/* --------------------------
  26. Animation style
----------------------------- */
@-webkit-keyframes buttonEffectRight {
    0% {
        right: -100%;
    }
    100% {
        right: 100%;
    }
}

@keyframes buttonEffectRight {
    0% {
        right: -100%;
    }
    100% {
        right: 100%;
    }
}

@-webkit-keyframes shakeItem {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    20% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    41% {
        -webkit-transform: translateY(-15px);
        transform: translateY(-15px);
    }
    50% {
        -webkit-transform: translateY(-7px);
        transform: translateY(-7px);
    }
    50% {
        -webkit-transform: translateY(-7px);
        transform: translateY(-7px);
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@keyframes shakeItem {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    20% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
    41% {
        -webkit-transform: translateY(-15px);
        transform: translateY(-15px);
    }
    50% {
        -webkit-transform: translateY(-7px);
        transform: translateY(-7px);
    }
    50% {
        -webkit-transform: translateY(-7px);
        transform: translateY(-7px);
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

@-webkit-keyframes shadowPulse {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(107, 109, 112, 0.6);
        box-shadow: 0 0 0 0 rgba(107, 109, 112, 0.6);
    }
    70% {
        -webkit-box-shadow: 0 0 0 3.125rem rgba(107, 109, 112, 0);
        box-shadow: 0 0 0 3.125rem rgba(107, 109, 112, 0);
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 rgba(107, 109, 112, 0);
        box-shadow: 0 0 0 0 rgba(107, 109, 112, 0);
    }
}

@keyframes shadowPulse {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(107, 109, 112, 0.6);
        box-shadow: 0 0 0 0 rgba(107, 109, 112, 0.6);
    }
    70% {
        -webkit-box-shadow: 0 0 0 3.125rem rgba(107, 109, 112, 0);
        box-shadow: 0 0 0 3.125rem rgba(107, 109, 112, 0);
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 rgba(107, 109, 112, 0);
        box-shadow: 0 0 0 0 rgba(107, 109, 112, 0);
    }
}

@-webkit-keyframes preloader {
    0% {
        top: 8px;
        height: 64px;
    }
    50%,
    100% {
        top: 24px;
        height: 32px;
    }
}

@keyframes preloader {
    0% {
        top: 8px;
        height: 64px;
    }
    50%,
    100% {
        top: 24px;
        height: 32px;
    }
}

@-webkit-keyframes dashedRotate {
    0% {
        transform: rotate(0);
    }
    100% {
        transform: rotate(360deg);
    }
}

@keyframes dashedRotate {
    0% {
        transform: rotate(0);
    }
    100% {
        transform: rotate(360deg);
    }
}

@-webkit-keyframes iconPulse {
    0% {
        -webkit-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1);
        opacity: 0;
    }
    50% {
        opacity: .2;
    }
    100% {
        opacity: 0;
        -webkit-transform: scale(1.3);
        -ms-transform: scale(1.3);
        -o-transform: scale(1.3);
        transform: scale(1.3);
    }
}

@keyframes iconPulse {
    0% {
        -webkit-transform: scale(1);
        -ms-transform: scale(1);
        -o-transform: scale(1);
        transform: scale(1);
        opacity: 0;
    }
    50% {
        opacity: .2;
    }
    100% {
        opacity: 0;
        -webkit-transform: scale(1.3);
        -ms-transform: scale(1.3);
        -o-transform: scale(1.3);
        transform: scale(1.3);
    }
}

@-webkit-keyframes slide {
    0%,
    100% {
        -webkit-transform: translateX(0px);
        transform: translateX(0px);
    }
    50% {
        -webkit-transform: translateX(70px);
        transform: translateX(70px);
    }
}

@keyframes slide {
    0%,
    100% {
        -webkit-transform: translateX(0px);
        transform: translateX(0px);
    }
    50% {
        -webkit-transform: translateX(70px);
        transform: translateX(70px);
    }
}

/* --------------------------
  27. Demo Page Custom style
----------------------------- */
@media (min-width: 768px) {
    .btn.btn-purchase:not(.btn-lg):not(.btn-sm) {
        padding-right: 48px;
        position: relative;
        min-height: 44px;
    }

    .btn.btn-purchase:not(.btn-lg):not(.btn-sm) .icon {
        width: 34px;
        height: 34px;
        position: absolute;
        top: 4px;
        right: 4px;
        display: flex;
        align-items: center;
        justify-content: center;
        background: rgba(255, 255, 255, 0.9);
        border-radius: 22px;
        font-size: 24px;
        color: #714B67;
    }
}

.btn.btn-purchase .icon-mobile {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    width: 34px;
    height: 34px;
}

.card.card-template-demo {
    position: relative;
    overflow: hidden;
    top: 0;
    transition: all 0.3s ease;
    transform: scale(1);
}

.card.card-template-demo .card-title {
    font-weight: 600;
}

.card.card-template-demo .overlay-link {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #03c;
    background: linear-gradient(-45deg, #03c 0%, #8900cc 100%);
    opacity: 0;
    top: 30%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    color: #ffffff;
    -webkit-backdrop-filter: blur(0px);
    backdrop-filter: blur(0px);
    border-radius: 10px;
}

.card.card-template-demo .overlay-link .icon {
    position: relative;
    width: 3rem;
    height: 3rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: all 0.5s ease;
    top: 100px;
    opacity: 0;
}

.card.card-template-demo:hover {
    top: -5px;
    transform: scale(1.05);
    z-index: 9;
}

.card.card-template-demo:hover .overlay-link {
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    top: 0;
    opacity: .9;
}

.card.card-template-demo:hover .overlay-link .icon {
    top: 0;
    opacity: 1;
}

.card.card-key-feature {
    transition: all 0.2s ease;
    transform: scale(1) translateY(0);
    box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);
}

.card.card-key-feature .icon {
    position: relative;
    height: 40px;
    width: 40px;
    line-height: 40px;
    font-size: 24px;
    background: rgba(107, 109, 112, 0.05);
    background: linear-gradient(45deg, rgba(107, 109, 112, 0.05) 0%, rgba(107, 109, 112, 0.1) 100%);
    color: #714B67;
}

.card.card-key-feature .title {
    font-weight: 300;
}

.card.card-key-feature:hover {
    transform: scale(1.05) translateY(-5px);
    box-shadow: 0px 10px 20px rgba(107, 109, 112, 0.1);
}

/* --------------------------
  28. Responsive style
----------------------------- */
/* ******************************
:: 2.0 WELCOME AREA CSS
****************************** */
@media (min-width: 767px) {
    .welcome-area {
        padding-top: 0;
    }
}

@media (min-width: 992px) {
    .welcome-area.mh-950 {
        min-height: 950px;
    }

    .welcome-area .shape-fullsection .shape-top-cube {
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        position: absolute;
        background-color: rgba(107, 109, 112, 0.01);
        z-index: -5;
    }

    .welcome-area .shape-fullsection .shape-top-cube:before, .welcome-area .shape-fullsection .shape-top-cube:after {
        width: 1000px;
        height: 1000px;
        content: "";
        position: absolute;
        right: 0;
        top: 0;
        transform: rotate(-37deg) translate(28%, -38%);
        border-radius: 100px;
        background: #03c;
        background: linear-gradient(45deg, #03c 0%, #8900cc 100%);
        z-index: -101;
    }

    .welcome-area .shape-fullsection .shape-top-cube:before {
        transform: rotate(-37deg) translate(28%, -38%) scale(1.07);
        opacity: .1;
    }

    .section-ptb {
        padding-top: 100px;
        padding-bottom: 100px;
    }

    .section-pb{
        padding-bottom: 100px;
    }

    .section-ptb-50 {
        padding-top: 50px;
        padding-bottom: 50px;
    }



    section .section-heading {
        margin-bottom: 50px;
    }
}

/* ******************************
:: 2.0 HEADER NAVIGATION AREA CSS
****************************** */
@media (min-width: 992px) {
  .navbar.navbar-sticky-on-top{
    padding-bottom: 0.625rem;
    padding-top: 0.725rem;
  }
    .navbar .navbar-nav .nav-link {
        padding-top: 1.875rem;
        padding-bottom: 1.875rem;
        transition: all 0.2s ease;
    }

    .navbar .navbar-nav .dropdown-menu {
        box-shadow: 0px 0.188rem 0.625rem rgba(107, 109, 112, 0.1);
        -webkit-box-shadow: 0px 0.188rem 0.625rem rgba(107, 109, 112, 0.1);
    }

    .navbar .navbar-nav .dropdown-menu li:first-child a {
        border-radius: 0.25rem 0.25rem 0 0;
    }

    .navbar .navbar-nav .dropdown-menu li:last-child a {
        border-radius: 0 0 0.25rem 0.25rem;
    }

    .navbar .navbar-nav li:hover > ul.dropdown-menu {
        opacity: 1;
        transform: translateY(0);
        visibility: visible;
    }

    .navbar .navbar-nav li:hover > ul.dropdown-menu .dropdown-item {
        padding-left: 1.5rem;
    }

    .navbar:not(.navbar-sticky-on-top) .navbar-nav .nav-link {
        color: #fff;
    }

    .navbar.navbar-sticky-on-top .navbar-nav .nav-link {
        padding-top: 1.625rem;
        padding-bottom: 1.625rem;
    }

    .navbar .dropdown-menu {
        opacity: 0;
        display: block;
        visibility: hidden;
        min-width: 14.375rem;
        margin-top: 0;
        transform: translateY(20px);
    }

    .dropdown-menu .dropdown .dropdown-menu {
        left: 100%;
        top: 0%;
        margin: 0 20px;
        border-width: 0;
    }

    .dropdown-menu .dropdown .dropdown-menu {
        margin: 0;
        border-width: 1px;
    }
}

@media (max-width: 991px) {
    body:before {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        transition: all 0.2s ease;
        content: "";
        z-index: 50;
        background: rgba(60, 64, 77, 0);
        visibility: hidden;
    }

    body.sidemenu-open:before {
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(60, 64, 77, 0.8);
        visibility: visible;
    }

    .navbar {
        padding-top: 0.625rem;
        padding-bottom: 0.625rem;
    }

    .navbar.active {
        display: block;
    }

    .navbar.active .navbar-inner {
        right: 0;
    }

    .navbar .navbar-inner {
        right: 0;
        -webkit-transition: right 0.3s 0.2s;
        transition: right 0.3s 0.2s;
        position: fixed;
        top: 0;
        bottom: 0;
        height: 100% !important;
        width: 320px;
        padding-top: 54px;
        background-color: #ffffff;
        -webkit-box-shadow: 0 0.5rem 1.875rem rgba(0, 0, 0, 0);
        box-shadow: 0 0.5rem 1.875rem rgba(0, 0, 0, 0);
        border-radius: 0;
        overflow-y: auto;
        z-index: 1050;
        display: block;
        transform: translateX(320px);
        transition: all 0.2s ease;
    }

    .navbar .navbar-inner.show {
        transform: translateX(0);
        -webkit-box-shadow: 0 0.5rem 1.875rem rgba(0, 0, 0, 0.15);
        box-shadow: 0 0.5rem 1.875rem rgba(0, 0, 0, 0.15);
    }

    .navbar .navbar-inner .dropdown-menu {
        border: medium none;
        background: none;
        border-radius: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
        float: none;
        margin: 0;
        padding-top: 0;
        position: static;
    }

    .navbar .navbar-inner .dropdown-menu:before {
        content: none;
    }

    .navbar .nav-link {
        border-bottom: 1px solid #eee;
        padding-top: 0.75rem;
        padding-bottom: 0.75rem;
    }

    .navbar.navbar-dark .nav-link:hover, .navbar.navbar-dark .nav-link:focus, .navbar.navbar-dark .nav-link.active, .navbar.navbar-dark .nav-link.current-menu-item {
        color: #2c2e30;
    }

    .nav-open .main-wrapper {
        -webkit-transform: translate3d(-150px, 0, 0);
        transform: translate3d(-150px, 0, 0);
    }

    /*MOBILE NAVBAR TOGGLER*/
    .navbar-toggler {
        position: fixed;
        top: auto;
        right: 0;
        bottom: auto;
        left: auto;
        border: none;
        height: 54px;
        width: 3.75rem;
        background-image: none;
        border-radius: 0;
        z-index: 1051;
        display: inline-block;
    }

    .navbar-inner .navbar-toggler {
        position: absolute;
        height: 2.5rem;
        top: 0;
    }

    .navbar-toggler-icon {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        margin: auto;
        background-image: none !important;
        height: 3px;
        width: 50%;
        background: #838a9f;
        display: inline-block;
        transition: all 0.3s ease;
    }

    .navbar-toggler-icon:before, .navbar-toggler-icon:after {
        transition: all 0.3s ease;
        content: "";
        background: #838a9f;
        left: 0;
        height: 100%;
        width: 100%;
        position: absolute;
    }

    .navbar-toggler-icon:before {
        top: -0.625rem;
    }

    .navbar-toggler-icon:after {
        top: 0.625rem;
    }

    .navbar-dark .navbar-toggler-icon:not(.navbar-toggler-dark) {
        background: #ffffff;
    }

    .navbar-dark .navbar-toggler-icon:not(.navbar-toggler-dark):before, .navbar-dark .navbar-toggler-icon:not(.navbar-toggler-dark):after {
        background: #ffffff;
    }

    .navbar-dark.active:not(.navbar-toggler-dark) .navbar-toggler-icon {
        background: transparent;
    }

    .navbar-dark.active:not(.navbar-toggler-dark) .navbar-toggler-icon:before, .navbar-dark.active:not(.navbar-toggler-dark) .navbar-toggler-icon:after {
        background: #838a9f;
    }

    .navbar-sticky-on-top:not(.navbar-toggler-dark) .navbar-toggler-icon {
        background: #838a9f;
    }

    .navbar-sticky-on-top:not(.navbar-toggler-dark) .navbar-toggler-icon:before, .navbar-sticky-on-top:not(.navbar-toggler-dark) .navbar-toggler-icon:after {
        background: #838a9f;
    }

    .navbar-toggler-icon.active {
        background-color: transparent;
        -webkit-transform: scale(0.85) rotate(270deg);
        transform: scale(0.85) rotate(270deg);
    }

    .navbar-toggler-icon.active:before, .navbar-toggler-icon.active:after {
        background-color: #3C404D;
    }

    .navbar-toggler-icon.active:before {
        top: 0;
        -webkit-transform: scale(0.65) rotate(45deg);
        transform: scale(0.65) rotate(45deg);
    }

    .navbar-toggler-icon.active:after {
        top: 0;
        -webkit-transform: scale(0.65) rotate(-45deg);
        transform: scale(0.65) rotate(-45deg);
    }
}

/*SECTION HEADING*/
@media (max-width: 991px) {
    h1 {
        font-size: 3em;
    }

    h2 {
        font-size: 36px;
    }

    section .section-heading {
        margin-bottom: 50px;
    }
}

@media (max-width: 767px) {
    h1 {
        font-size: 2.8em;
    }

    h2 {
        font-size: 30px;
        line-height: 1.4;
    }
}

@media (max-width: 575px) {
    h1 {
        font-size: 2em;
        line-height: 1.4;
    }

    h2 {
        font-size: 24px;
        line-height: 1.4;
    }

    h3 {
        font-size: 18px;
        line-height: 1.4;
    }

    p {
        line-height: 26px;
    }

    .section-heading > h2 {
        line-height: 1.5;
    }
}

/* --------------------------
04. How it Works style
----------------------------- */
@media (min-width: 990px) {
    .how-it-works-process .how-it-work-process-item:not(:last-child) .how-it-work-step:before {
        background: url(../img/bg/dassed-line.svg) repeat-x left center;
        content: "";
        position: absolute;
        left: 50%;
        top: 50%;
        width: 100%;
        height: 4px;
        transform: translate(0, -50%);
    }
}

/* --------------------------
04. Pricing style
----------------------------- */
@media (min-width: 990px) {
    .section-pricing .pricing-pills .nav-pills .nav-item .nav-link {
        padding-left: 3.125rem;
        padding-right: 3.125rem;
    }

    .section-pricing .card.card-pricing.active {
        transform: scale(1.05);
    }
}

@media (min-width: 992px) {
    .footer .footer-bottom {
        padding: 1.5rem 0;
    }

    .footer .footer-bottom .footer-menu {
        justify-content: flex-end;
    }
}

/*# sourceMappingURL=styles.css.map */

/* Social share footer */
ul.social {
    list-style-type: none;
    padding: 0;
}
ul.social > li {
    margin-bottom: 1rem;
}

.linkedin-share-button{
    padding: 2px 10px;
    background-color: #eee;
    color: #111;
    border-radius: 3px;
    font-size: 0.8rem;
}
.linkedin-share-button:hover{
    color: #999;
}

/* Titolo per descrizione app in landing Odoo */
.related-apps {
    height: 40px;
    padding: 12px 15px;
    background-color: #E9ECEF;
}

/* Contenitore immagine PC */
.pc-content {
    height: 300px;
}
@media (min-width: 990px) {
    .pc-content {
        height: 500px;
    }
}

/* nascondi share button se non sei loggato */
.fb-share-button {
    display: none;
}
a.twitter-share-button {
    display: none !important;
}