:root {
    --primary-300: #243161;
    --primary-100: #8088a4;
    --primary-75: #a5abbf;
    --primary-70: #ccd0db;
    --primary-60: #f4f5f7;
    --primary-50: #e9eaef;
    --secondary-300: #33c9be;
    --error-300: #ff3b30;
    --box-border: var(--primary-50);
    --help-center-box: var(--primary-60);
    --statement-type: var(--primary-300);
    --search-bg: var(--primary-60);
    --search-placeholder: var(--primary-100);
    --font-main: var(--primary-300)
}

.nav-main-link {
    color: #243161;
    font-size: 13px;
    text-align: start;
    margin: 0 5px;
    font-weight: 700
}

@media(min-width: 1366px) {
    .nav-main-link {
        font-size:16px;
        font-weight: 500
    }
}

.nav-main-link:hover {
    color: #243161
}

.dropdown-menu li {
    margin-bottom: .25rem
}

.dropdown-item {
    text-align: start;
    margin-bottom: .5rem
}

.dropdown-item:hover {
    background-color: transparent
}

@media(max-width: 821px) {
    .dropdown {
        width:100%;
        display: inline-flex;
        position: relative;
        border-bottom: 1px solid rgba(0,0,0,.129);
        text-align: start
    }

    .dropdown button {
        padding: 15px;
        margin: 0
    }

    .dropdown[data-lang=ar] {
        left: 5%!important
    }

    .dropdown[data-lang=en] {
        right: 5%!important
    }
}

.blog-search {
    padding: .75rem 1rem;
    width: 300px;
    display: flex;
    gap: .75rem;
    align-items: center;
    background-color: #f9f9f9;
    border-radius: .5rem
}

.blog-search input {
    margin-top: -3px;
    background-color: #f9f9f9;
    width: 100%;
    border: 0;
    outline: 0;
    color: #000
}

.blog-search input::placeholder {
    color: #8088a4;
    font-size: 14px;
    font-weight: 400;
    line-height: 14px;
    letter-spacing: 0
}

.blog-search label {
    margin-top: -3px
}

@media(max-width: 821px) {
    .blog-search {
        width:100%
    }
}

.blog-search-row {
    display: flex;
    flex-direction: column;
    gap: .5rem;
    margin-bottom: 20px
}

@media(min-width: 992px) {
    .blog-search-row {
        display:flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 30px
    }
}

[type=search] {
    outline-offset: -2px;
    -webkit-appearance: textfield
}

.no-blogs-found {
    width: 100%;
    display: flex;
    justify-content: center;
    margin: 3rem 0;
    color: #243161
}

.blogs-main {
    display: flex;
    gap: 1rem;
    flex-direction: column
}

.blogs-main .latest-posts-flex,.blogs-main .special-post-flex {
    width: 100%;
    flex: 0 0 auto
}

.blogs-main .second-special-post div.col-md-5 {
    width: 100%
}

.blogs-main .second-special-post img.post-thumbnail {
    height: 100%!important;
    max-height: -moz-fit-content!important;
    max-height: fit-content!important;
    margin-top: 2rem
}

@media(min-width: 992px) {
    .blogs-main {
        flex-direction:row
    }

    .blogs-main .special-post-flex {
        width: 60%;
        flex: 0 0 auto
    }

    .blogs-main .latest-posts-flex {
        width: 40%;
        flex: 0 0 auto
    }

    .blogs-main .second-special-post div.col-md-5 {
        flex: 0 0 auto;
        width: 41.66666667%
    }

    .blogs-main .second-special-post img.post-thumbnail {
        height: 100%;
        max-height: 224px;
        object-fit: cover;
        border-radius: 5px;
        margin-top: 0
    }
}

.blog-pill {
    transform: translateY(-2px);
    outline: 1px solid #8088a4;
    border-radius: 30px;
    padding: 0 1rem 4px;
    margin: 0 .25rem;
    font-size: 11px;
    display: inline-block
}

.dropdown:hover>.dropdown-menu {
    display: block;
    position: absolute
}

.dropdown>.dropdown-toggle:active {
    pointer-events: none
}

.dropdown-toggle:after {
    -webkit-margin-start: .255em;
    margin-inline-start:.255em;display: inline-block;
    content: "";
    border: 0;
    background-image: url(/wp-content/themes/theforest/images/down-arrow.webp);
    background-size: cover;
    background-position: 50%;
    position: absolute;
    z-index: -1;
    height: 7px;
    width: 10px;
    bottom: 33%
}

.dropdown-toggle:after[data-lang=ar] {
    left: -5%
}

.dropdown-toggle:after[data-lang=en] {
    right: -5%
}

@keyframes spin {
    to {
        transform: rotate(1turn)
    }
}

.spin {
    transform-origin: center;
    animation: spin 1s ease-in-out infinite
}

.help-center-faq {
    margin-top: 60px
}

.help-center-faq .help-center-faq-box {
    cursor: pointer;
    padding: 1.5rem 2rem;
    border-radius: .5rem;
    background: var(--help-center-box)
}

.help-center-faq .help-center-faq-box[data-open=true] {
    border-radius: .5rem .5rem 0 0;
    border-top: 1px solid var(--box-border);
    border-right: 1px solid var(--box-border);
    border-left: 1px solid var(--box-border);
    margin-bottom: 0
}

.help-center-faq .help-center-faq-box[data-open=false] {
    border-radius: .5rem;
    margin-bottom: 1rem;
    border: 1px solid var(--box-border)
}

.help-center-faq .help-center-faq-box .main-title {
    color: var(--font-main)
}

@media(min-width: 992px) {
    .help-center-faq .help-center-faq-box .main-title {
        font-size:18px;
        font-family: sst-medium
    }
}

.help-center-faq .help-center-faq-box .content {
    margin-top: 2rem;
    color: var(--primary-100)
}

.help-center-faq .help-center-faq-box a {
    color: blue!important
}

.like-flex {
    display: flex;
    align-items: center;
    gap: .25rem;
    cursor: pointer
}

.like-flex.unhelpful-label {
    color: var(--error-e300)!important
}

.like-flex.helpful-label {
    color: var(--secondary-300)!important
}

.like-seperator {
    width: 1px;
    background-color: var(--primary-70)
}

.like-container {
    display: flex;
    gap: .75rem
}

.help-center-answer {
    padding: 1rem 3rem;
    margin: 0 0 1.5rem;
    border-radius: .5rem;
    background: var(--help-center-box);
    border-right: 1px solid var(--box-border);
    border-left: 1px solid var(--box-border);
    border-bottom: 1px solid var(--box-border)
}

.help-center-answer[data-open=true] {
    border-radius: 0 0 .5rem .5rem;
    margin-bottom: 1rem
}

.help-center-answer[data-open=false] {
    display: none;
    border-radius: 0;
    margin-bottom: 0
}

@media(min-width: 992px) {
    .help-center-answer .main-title {
        font-size:18px
    }
}

.help-center-answer .content {
    color: var(--primary-100)
}

.help-center-answer a {
    color: blue!important
}

.help-category-type {
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    gap: 2rem;
    border-bottom: 1px solid var(--filters-header);
    overflow-x: auto;
    margin-bottom: 2.5rem;
    white-space: nowrap;
    -ms-overflow-style: none;
    scrollbar-width: none
}

.help-category-type::-webkit-scrollbar {
    display: none
}

.help-category-type .type {
    display: flex;
    gap: .5rem;
    flex-direction: column;
    cursor: pointer;
    color: var(--primary-75)
}

.help-category-type .type .selected-font {
    color: var(--statement-type)
}

.help-category-type .type .selected {
    height: 4px;
    width: 100%;
    background: var(--statement-type);
    border-radius: 6px
}

.zakat-types {
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: nowrap;
    flex-direction: column;
    gap: 1rem;
    border-bottom: 1px solid var(--filters-header);
    overflow-x: auto;
    margin-bottom: 2.5rem;
    white-space: nowrap;
    -ms-overflow-style: none;
    scrollbar-width: none
}

.zakat-types::-webkit-scrollbar {
    display: none
}

.zakat-types .zakat-flex {
    display: flex;
    gap: 2rem
}

.zakat-types .type {
    display: flex;
    justify-content: flex-end;
    gap: .5rem;
    flex-direction: column;
    cursor: pointer;
    color: var(--primary-75)
}

.zakat-types .type .selected-font {
    color: var(--statement-type)
}

.zakat-types .type .selected {
    height: 4px;
    width: 100%;
    background: var(--statement-type);
    border-radius: 6px
}

@media(min-width: 822px) {
    .zakat-types {
        flex-direction:row
    }
}

.help-search {
    padding: .75rem 1rem;
    width: 300px;
    display: flex;
    gap: .75rem;
    align-items: center;
    border-radius: .5rem
}

.help-search,.help-search input {
    background-color: var(--search-bg)
}

.help-search input {
    width: 100%;
    border: 0;
    outline: 0;
    color: var(--font-main)
}

.help-search input::placeholder {
    color: var(--search-placeholder);
    font-size: 14px;
    font-weight: 400;
    line-height: 14px;
    letter-spacing: 0
}

@media(max-width: 821px) {
    .help-search {
        width:100%
    }
}

.search-flex {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center
}

.flex-space-between {
    display: flex;
    justify-content: space-between
}

.rotate-180-y {
    transform: rotate(180deg)
}

.header-flex-2 {
    display: flex;
    justify-content: space-between
}

@media(max-width: 821px) {
    .header-flex-2.sm-col-flex {
        flex-direction:column;
        gap: 1rem
    }
}

.portfolio-title {
    display: flex;
    align-items: center;
    gap: .7rem
}

.pb-2rem {
    padding-bottom: 2rem
}

.mt-2rem {
    margin-top: 2rem
}

.my-3rem {
    margin-top: 3rem;
    margin-bottom: 3rem
}

.flex {
    display: flex
}

.items-center {
    align-items: center
}

.sharia-member-card {
    width: 300px
}

@media(max-width: 821px) {
    .sharia-member-card {
        width:100%;
        margin-bottom: 20px
    }
}

.sharia-member-bio {
    width: 60%
}

@media(max-width: 821px) {
    .sharia-member-bio {
        width:100%;
        padding: 0 1rem
    }

    .sharia-team-row {
        flex-direction: column
    }
}

.img-rotate[data-lang=en] {
    transform: rotate(90deg)
}

@font-face {
    font-family: sst-medium;
    src: url(/wp-content/themes/theforest/font//SSTArabic-Medium.aa29b906.woff2) format("woff2"),url(/wp-content/themes/theforest/font//SSTArabic-Medium.078d89c6.woff) format("woff");
    font-weight: 500;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: SST;
    src: url(/wp-content/themes/theforest/font//SSTArabic-Light.08b9d614.woff2) format("woff2"),url(/wp-content/themes/theforest/font//SSTArabic-Light.f7d69052.woff) format("woff");
    font-weight: 300;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: SST;
    src: url(/wp-content/themes/theforest/font//SSTArabic-Bold.5e1d72bc.woff2) format("woff2"),url(/wp-content/themes/theforest/font//SSTArabic-Bold.3ceb1529.woff) format("woff");
    font-weight: 700;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: SST;
    src: url(/wp-content/themes/theforest/font//SSTArabic-Roman.2c014ba4.woff2) format("woff2"),url(/wp-content/themes/theforest/font//SSTArabic-Roman.ebaaf4ca.woff) format("woff");
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

:root {
    --gray-600: #666;
    --blue-400: #50aede;
    --blue-700: #263162;
    --blue-800: #243161;
    --green-300: #4dbab5
}

* {
    font-family: SST;
    letter-spacing: 0!important
}

.avenir {
    font-family: Avenir
}

.mobile {
    display: none
}

a,button,div,h1,h2,h3,h4,h5,h6,label,option,p,select,span,ul {
    margin: 0;
    padding: 0
}

.vcenter-item,.vcenter-item[dir=ltr] {
    display: flex;
    align-items: center
}

.vcenter-item[dir=ltr] {
    justify-content: flex-start;
    direction: rtl;
    text-align: end
}

.align-items {
    align-items: center
}

.pt-50 {
    padding-top: 50px
}

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

.pt-100 {
    padding-top: 100px
}

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

.pt-150 {
    padding-top: 150px
}

.pb-150 {
    padding-bottom: 150px
}

.pt-200,.t-pt-200 {
    padding-top: 200px
}

.pb-200 {
    padding-bottom: 200px
}

.bg-gray {
    background-color: #f7f7f7!important
}

.bg-light-blue {
    background-color: #51aede!important
}

.font-white {
    color: #fff
}

.font-dark-blue {
    color: #192451
}

.bg-beige {
    background: #fff;
    background: radial-gradient(circle,#fff 0,#f5efe3 55%)
}

.line-height-120 {
    line-height: 1.5
}

.font-yellow {
    color: #f3d961
}

.flex-col {
    display: flex;
    flex-direction: column;
    gap: 3rem
}

.align-center {
    align-items: center
}

.text-center {
    text-align: center
}

.flex-center {
    display: flex;
    justify-content: center
}

.zakat-mask {
    z-index: 5;
    position: absolute;
    height: 90vh
}

.row-zakat {
    z-index: 10;
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    display: flex;
    justify-content: center;
    flex-wrap: nowrap;
    margin-top: calc(var(--bs-gutter-y) * -1);
    margin-left: calc(var(--bs-gutter-x) * -.5);
    margin-right: calc(var(--bs-gutter-x) * -.5);
    gap: 3rem;
    align-items: center
}

.banner {
    z-index: 75;
    max-width: 450px
}

.list-links {
    display: flex;
    justify-content: flex-end;
    margin: 1rem 0;
    color: #fff
}

.link-route {
    color: #fff;
    text-decoration: none
}

.link-route:hover {
    opacity: .8;
    color: #fff
}

.privay-title {
    text-align: center;
    color: #243161;
    margin-bottom: 30px;
    margin-top: 65px
}

.mb-60 {
    margin-bottom: 60px
}

.grid-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 2rem;
    gap: 2rem
}

.download-btn-group {
    display: flex;
    justify-content: center;
    gap: .5rem;
    margin-top: 1rem
}

.download-btn {
    width: 140px
}

.content-padding {
    padding-bottom: 5rem
}

.text-end {
    text-align: end
}

.seperator-line {
    border-top: .5px solid #000;
    margin: 1rem 0
}

body::-webkit-scrollbar {
    display: none
}

.c-container {
    position: absolute!important;
    top: 0!important;
    z-index: 100;
    width: 100%;
    background-color: #f7f7f7
}

button:focus,input {
    outline: 0!important;
    box-shadow: none!important
}

section.header {
    z-index: 9;
    position: relative
}

section.header .container {
    position: relative;
    display: grid
}

.c-main-navbar {
    position: absolute;
    top: 0;
    width: 100%;
    background-color: #002131
}

.student-main-navbar {
    position: absolute;
    padding: 20px 30px 0;
    width: 100%;
    background-color: #fff
}

.main-navbar {
    position: absolute;
    padding: 20px 0 50px;
    width: 100%
}

img.main-logo {
    width: 150px
}

ul.navbar-nav.left-nav {
    float: inline-end;
    align-items: center
}

ul.navbar-nav.left-nav li a {
    color: #243161;
    margin: 0 5px;
    font-weight: 500
}

ul.navbar-nav.left-nav li a[dir=ltr],ul.navbar-nav.left-nav li div {
    color: #243161;
    margin: 0 2px;
    font-weight: 500
}

ul.navbar-nav.left-nav li div {
    cursor: pointer
}

ul.navbar-nav.left-nav li a.btn-login {
    background: #f3d961;
    color: #243161;
    border-radius: 50px;
    padding: 10px 15px 16px;
    margin-right: 10px;
    margin-left: 0;
    font-weight: 700
}

ul.navbar-nav.left-nav li a.btn-login[dir=ltr] {
    margin-right: 0;
    margin-left: 10px
}

.ms-10px[dir=rtl] {
    margin-left: 0!important;
    margin-right: 10px!important
}

.ms-10px[dir=ltr] {
    margin-right: 0!important;
    margin-left: 10px!important
}

.lg-hidden {
    display: none
}

img.h-icon-user {
    width: 35px;
    height: 35px
}

.how-to-start {
    margin-right: 10px
}

.how-to-start,.li-icon-user {
    position: relative
}

a.nav-link.active:before {
    background: #ffd200;
    width: 10px;
    height: 10px;
    border-radius: 10px;
    position: absolute;
    content: "";
    bottom: -10px;
    left: 0;
    right: 0;
    margin: 0 auto
}

a.nav-link.active {
    position: relative
}

li.nav-item.li-icon-user a:before {
    display: none
}

@keyframes item-1-anim {
    0%,25% {
        transform: translateX(-100%)
    }

    33.3%,58.3% {
        transform: translateX(0)
    }

    66.6%,83.2% {
        visibility: hidden;
        transform: translateX(100%);
        display: none
    }

    to {
        visibility: hidden;
        transform: translateX(-100%);
        display: none
    }
}

@keyframes item-2-anim {
    0%,25% {
        transform: translateX(0)
    }

    33.3%,50% {
        visibility: hidden;
        transform: translateX(100%);
        display: none
    }

    66.6%,91.53% {
        visibility: hidden;
        transform: translateX(-100%);
        display: none
    }

    to {
        transform: translateX(0)
    }
}

@keyframes item-3-anim {
    0%,25% {
        visibility: hidden;
        transform: translateX(100%);
        display: none
    }

    33.3% {
        visibility: hidden;
        transform: translateX(-100%);
        display: none
    }

    58.3% {
        transform: translateX(-100%)
    }

    66.6%,91.53% {
        transform: translateX(0)
    }

    to {
        transform: translateX(100%)
    }
}

.item-1 {
    position: absolute!important;
    animation: item-1-anim 21s linear infinite
}

.item-2 {
    animation: item-2-anim 21s linear infinite
}

.item-2,.item-3 {
    top: 0;
    position: absolute!important
}

.item-3 {
    animation: item-3-anim 21s linear infinite
}

.carousel {
    overflow: hidden;
    position: relative;
    height: 90vh
}

section.home-hero {
    width: 100%;
    overflow-x: hidden
}

.white-font {
    color: #fff!important
}

.red-bg {
    background: #c7443e;
    background-image: url(/wp-content/themes/theforest/images/banners/red-square.webp);
    background-size: 50px 50px
}

.bg-dark-blue {
    background: #242a50;
    background-size: 50px 50px
}

.bg-app-banner[dir=rtl] {
    background: linear-gradient(270deg,#0d3052 57.5%,#0d3052 0)
}

.bg-app-banner[dir=ltr] {
    background: linear-gradient(90deg,#0d3052 57.5%,#0d3052 0)
}

.performance-link {
    color: #fafafa;
    opacity: .6;
    cursor: pointer;
    text-decoration: underline;
    padding: .25rem;
    text-align: center
}

.bg-yellow-square {
    background: #e2c25a;
    background-image: url(/wp-content/themes/theforest/images/banners/yellow-rect.webp);
    background-size: 50px 50px
}

.dark-green-bg {
    background: #4caeaa;
    background-image: url(/wp-content/themes/theforest/images/banners/green-square.webp);
    background-size: 50px 50px
}

.mt-5r {
    margin-top: 5rem
}

.transition {
    transition: transform .6s ease-in-out!important
}

section.home-hero .container {
    height: 100%;
    display: grid;
    align-items: center
}

section.home-hero:after {
    content: "";
    position: absolute;
    background-size: cover;
    background-repeat: no-repeat;
    z-index: 99;
    bottom: 0;
    right: 0
}

.red-container {
    position: absolute;
    bottom: 0;
    z-index: 10
}

.dark-blue-container {
    position: relative;
    bottom: 0;
    z-index: 5
}

.logo-center {
    z-index: 20;
    position: absolute;
    top: 50%;
    right: 0;
    transform: translate(-100%,125%);
    color: #fff;
    width: 150px
}

.bottom-edge {
    width: auto;
    height: 165px;
    position: absolute;
    bottom: 0
}

.right-edge {
    position: absolute;
    right: 0;
    min-height: 85vh;
    max-height: 90vh
}

section.home-hero:before {
    width: 50%
}

section.home-hero.dark-green-bg:before,section.home-hero:before {
    content: "";
    position: absolute;
    background-size: cover;
    height: 90vh;
    z-index: 1;
    bottom: 0
}

section.home-hero.dark-green-bg:before {
    background-color: #000;
    background-repeat: no-repeat;
    width: 100%
}

.tree-hero {
    position: absolute;
    bottom: 0;
    height: 80vh;
    z-index: 9
}

h1.home-hero-title {
    font-weight: 700;
    color: #fff;
    font-size: 56px;
    margin-bottom: 15px
}

h1.home-hero-title-md {
    font-weight: 700;
    color: #34c9be;
    font-size: 58px;
    margin-bottom: 15px
}

.download-text {
    font-size: 44px;
    color: #34c9be
}

h1.home-hero-title-white {
    font-weight: 700;
    font-size: 45px;
    margin-bottom: 15px
}

span.t-blue {
    color: #50aede
}

p.home-hero-p {
    margin-bottom: 50px;
    font-weight: 600;
    color: #243161
}

p.home-hero-p,p.home-hero-p-secondry {
    font-size: 20px;
    text-align: justify;
    line-height: 35px
}

p.home-hero-p-secondry {
    margin-bottom: 35px
}

.chart-title {
    margin-bottom: 10px
}

.main-btn {
    text-decoration: none;
    color: #243161;
    border-radius: 50px;
    padding: 10px 40px 16px;
    font-weight: 700;
    border: none
}

.btn-yellow {
    background: #f3d961
}

.btn-red {
    background: #b9443e;
    color: #fff
}

.btn-red:hover {
    background: #fff;
    color: #b9443e
}

a.btn-know-more {
    text-decoration: none;
    color: #243161;
    border-radius: 50px;
    padding-bottom: 16px;
    margin-right: 30px;
    font-weight: 700
}

a.btn-know-more i {
    padding-right: 8px
}

section.home-hero .col-md-6 {
    z-index: 99
}

.btn-yellow:hover {
    background: #243161;
    color: #f3d961
}

section.about {
    background: url(/wp-content/themes/theforest/images/about-us-bg.svg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: bottom;
    background-color: #192551
}

section.about,section.about[data-lang=en] {
    color: #fff;
    position: relative;
    overflow: hidden
}

section.about[data-lang=en] {
    background: url(/wp-content/themes/theforest/images/about-us-bg-en.svg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: bottom;
    background-color: #192551
}

img.about-img {
    width: 100%
}

canvas#about-img {
    left: -43px
}

canvas#about-img,canvas#about-img[data-lang=en] {
    margin-bottom: -80px;
    position: relative;
    width: 655px;
    height: 650px!important
}

canvas#about-img[data-lang=en] {
    left: 121px
}

h2.about-title {
    color: #50aede;
    margin-bottom: 25px;
    font-size: 45px;
    font-weight: 700
}

p.about-p {
    font-size: 17px;
    line-height: 40px;
    text-align: justify;
    margin-bottom: 20px;
    -webkit-padding-end: 70px;
    padding-inline-end:70px}

p.about-p.p-last {
    margin-bottom: 70px!important
}

section.about:after {
    content: "";
    position: absolute;
    background: url(/wp-content/themes/theforest/images/about-shape-gr.svg);
    background-size: cover;
    background-repeat: no-repeat;
    height: 100px;
    width: 100%;
    z-index: 99;
    bottom: 0;
    left: 0;
    right: 0
}

.about-img-div {
    position: relative
}

section.about:before {
    content: "";
    position: absolute;
    background: url(/wp-content/themes/theforest/images/about-arrow.svg);
    background-size: cover;
    background-repeat: no-repeat;
    height: 100%;
    width: 70%;
    z-index: 0;
    bottom: -100px;
    left: -98px
}

section.about-video {
    position: relative;
    background: url(/wp-content/themes/theforest/images/about-video-bg.svg);
    background-position: bottom;
    background-size: cover;
    background-repeat: no-repeat
}

section.about-video:after {
    content: "";
    position: absolute;
    background: url(/wp-content/themes/theforest/images/about-shape-w.svg);
    background-size: cover;
    background-repeat: no-repeat;
    height: 100px;
    width: 100%;
    z-index: 99;
    bottom: 0;
    left: 0;
    right: 0
}

h1.about-v-title {
    color: #243161;
    margin-bottom: 50px
}

img.about-v {
    width: 100%;
    object-fit: cover;
    object-position: 0 -10px;
    transform: scale(-1, 1);
}

.video-thumbnail {
    position: relative;
    width: 70%;
    display: block;
    margin: 0 auto
}

img.video-play {
    position: absolute;
    top: calc(50% + 30px);
    transform: translateY(-50%);
    left: 0;
    right: 0;
    margin: 0 auto
}

.wallet-card {
    position: relative
}

h4.wallet-title-s {
    color: #50aede;
    margin-bottom: 10px
}

h1.wallet-title {
    font-weight: 700;
    margin-bottom: 20px;
    color: #243161
}

p.wallet-para {
    font-size: 17px;
    line-height: 30px
}

section.wallet-type .main-title {
    width: 60%;
    display: block;
    margin: 0 auto 70px
}

img.about-v-t-icon {
    width: 50px
}

.wallet-card {
    color: #fff;
    width: 100%;
    padding: 0 15px
}

img.wallet-coin {
    width: 70%;
    display: block;
    margin: 0 auto 60px
}

h4.wallet-card-title {
    font-size: 35px;
    margin-bottom: 15px
}

.wallet-card .card-img-overlay {
    width: 80%;
    margin: 0 auto
}

p.wallet-card-para {
    font-size: 15px;
    margin-bottom: 35px
}

.wallet-card .card-img-overlay {
    height: max-content;
    top: calc(50%);
    transform: translateY(-50%);
    padding-top: 0
}

section.cta {
    position: relative
}

section.cta:before {
    position: absolute;
    content: "";
    background: #c8c8c8;
    height: 2px;
    width: 85%;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: calc(50%);
    transform: translateY(-50%);
    z-index: -1
}

h4.cta-title {
    color: #23397e;
    font-size: 30px;
    font-weight: 700;
    margin-bottom: 15px
}

p.cta-para {
    font-size: 18px;
    padding: 0 40px;
    margin-bottom: 40px
}

.cta-content {
    width: 50%;
    display: block;
    margin: 0 auto;
    background: #fff
}

.btn-default {
    background: #243161;
    color: #fff;
    border-radius: 30px;
    padding: 12px 30px;
    font-weight: 600;
    transition: all .3s ease;
    text-decoration: none
}

.btn-default:hover {
    background: #f3d961;
    color: #243161
}

.btn-blue {
    background: #243161;
    color: #f3d961!important
}

.btn-blue:hover {
    background: #f3d961;
    color: #243161!important
}

section.cta .main-btn.btn-blue {
    background: #50aede;
    color: #fff!important
}

section.cta .main-btn.btn-blue:hover {
    background: #243161
}

section.why-invest {
    position: relative;
    background: url(/wp-content/themes/theforest/images/why-invest-bg.svg?v=1.2);
    background-position: 50%;
    background-repeat: no-repeat
}

h1.why-invest-main-title {
    margin-bottom: 70px
}

img.why-invest-icon {
    margin-bottom: 25px
}

h4.why-invest-title {
    font-size: 26px;
    font-weight: 700;
    margin-bottom: 20px
}

p.why-invest-para {
    font-size: 17px
}

.why-invest-card {
    width: 90%;
    margin: 0 auto
}

section.invest {
    position: relative;
    overflow-x: hidden
}

h1.invest-title {
    color: #243161;
    font-size: 40px;
    line-height: 55px;
    margin-bottom: 25px;
    font-weight: 700
}

p.invest-para {
    font-size: 19px;
    text-align: justify;
    color: #666
}

.invest-content {
    padding-left: 50px
}

img.invest-img {
    width: 100%
}

.blog-body:before {
    background: url(/wp-content/themes/theforest/images/invest-bg.svg);
    background-size: contain;
    background-repeat: no-repeat;
    bottom: -20%;
    right: 0
}

.blog-body:after,.blog-body:before {
    content: "";
    position: absolute;
    height: 100%;
    width: 50%;
    z-index: 1
}

.blog-body:after {
    background: url(/wp-content/themes/theforest/images/security-bg.svg);
    background-size: contain;
    background-repeat: no-repeat;
    bottom: -70%;
    left: -10%
}

section.invest:before {
    content: "";
    position: absolute;
    background: url(/wp-content/themes/theforest/images/invest-bg.svg);
    background-size: contain;
    background-repeat: no-repeat;
    height: 100%;
    width: 50%;
    bottom: 0;
    right: -20%;
    z-index: -1
}

section.security {
    position: relative;
    overflow-x: hidden
}

h1.security-title {
    color: #243161;
    font-size: 40px;
    line-height: 55px;
    margin-bottom: 25px;
    font-weight: 700;
    text-align: start
}

p.security-para {
    font-size: 19px;
    text-align: justify;
    color: #666
}

.security-content {
    padding-right: 70px
}

img.security-img {
    width: 100%
}

section.security:before {
    content: "";
    position: absolute;
    background: url(/wp-content/themes/theforest/images/security-bg.svg);
    background-size: contain;
    background-repeat: no-repeat;
    height: 100%;
    width: 50%;
    bottom: 0;
    left: -10%;
    z-index: -1
}

section.calculator {
    background: #243161;
    position: relative
}

section.calculator:after {
    content: "";
    position: absolute;
    background: url(/wp-content/themes/theforest/images/calc-shape-t.svg);
    background-size: cover;
    background-repeat: no-repeat;
    height: 100px;
    width: 100%;
    z-index: 99;
    top: 0;
    left: 0;
    right: 0
}

section.team {
    background: #243161;
    color: #fff;
    position: relative
}

section.team:after {
    content: "";
    position: absolute;
    background: url(/wp-content/themes/theforest/images/calc-shape-b.svg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50%;
    height: 220px;
    width: 100%;
    z-index: 99;
    bottom: 0;
    left: 0;
    right: 0
}

section.team img {
    width: 100%
}

img.team-img {
    margin: 10px 0;
    z-index: 999;
    position: relative
}

.all-team {
    width: 70%;
    float: inline-end
}

img.team-active-img {
    width: 90%!important;
    position: relative;
    z-index: 9999
}

h4.t-name,img.team-active-img,p.t-quote,p.t-role {
    transition: visibility 0s linear .33s,opacity .33s linear;
    transition-delay: 0s;
    opacity: 1
}

h4.t-name {
    font-size: 25px;
    margin-bottom: 5px
}

p.t-role {
    color: #50aede;
    font-size: 20px;
    font-weight: 500;
    margin-bottom: 20px
}

p.t-quote {
    text-align: justify;
    font-size: 17px;
    line-height: 30px;
    margin-bottom: 35px;
    min-height: 160px
}

a.team-select {
    display: block
}

.team-active {
    position: relative
}

.team-active:after {
    content: "";
    position: absolute;
    background: url(/wp-content/themes/theforest/images/team-active-bg.webp);
    background-size: cover;
    background-repeat: no-repeat;
    height: 120%;
    width: 120%;
    z-index: 999;
    bottom: -250px;
    left: -13%
}

.accordion-button:after {
    background-image: url(/wp-content/themes/theforest/images/icon-plus.webp)
}

.accordion-button:not(.collapsed):after {
    background-image: url(/wp-content/themes/theforest/images/icon-minus.webp)
}

h1.faq-main-title {
    color: #243161;
    font-size: 40px;
    margin-bottom: 40px;
    font-weight: 700
}

img.icon-faq {
    width: 75px
}

.accordion-item {
    background: #fff;
    border: 2px solid #f8f8f8!important;
    box-shadow: 0 5px 10px 0 #f8f8f8;
    margin: 10px 0;
    min-height: 90px;
    display: grid;
    align-items: center
}

button.accordion-button {
    background: transparent!important;
    font-weight: 700;
    color: #101828!important
}

.accordion-button:not(.collapsed) {
    background: transparent!important;
    box-shadow: none!important;
    padding-bottom: 0
}

.accordion-item:last-of-type .accordion-collapse {
    background: #f8f8f8;
    font-size: 16px;
    color: #667085
}

.faq button[aria-expanded=true] {
    background: #f8f8f8!important
}

section.contact {
    background-image: url(/wp-content/themes/theforest/images/contact-bg.svg);
    background-color: #50aede;
    position: relative;
    background-repeat: no-repeat;
    background-position: 50%;
    background-size: cover
}

section.contact:after {
    content: "";
    position: absolute;
    background: url(/wp-content/themes/theforest/images/calc-shape-t.svg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 50%;
    height: 100px;
    width: 100%;
    z-index: 99;
    top: 0;
    left: 0;
    right: 0
}

h1.contact-main-title {
    color: #243161;
    font-size: 40px;
    font-weight: 700;
    margin-bottom: 15px
}

p.contact-main-p {
    color: #23397ecc
}

section.contact .main-title {
    margin-bottom: 40px
}

input.form-control {
    text-align: start;
    border-top-right-radius: 10px!important;
    border-bottom-right-radius: 10px!important;
    border-start-start-radius: 0!important;
    border-end-start-radius: 0!important
}

form.contact-f input.form-control,form.contact-f textarea {
    background: #fff;
    border-right: none;
    color: #838383!important;
    border-radius: 10px
}

form.contact-f input.form-control::placeholder,form.contact-f textarea::placeholder {
    color: #838383!important;
    opacity: 1
}

form.contact-f span {
    background: #fff;
    border-radius: 10px
}

form.contact-f .input-group {
    padding: 8px
}

form.contact-f .col-md-12,form.contact-f .col-md-6 {
    padding: 0
}

form.contact-f .main-btn.btn-blue {
    margin-top: 8px;
    text-align: center;
    color: #fff!important
}

img.icon-form {
    width: 20px;
    height: 20px
}

form.contact-f input.form-control {
    padding-right: 0;
    height: 45px
}

form.contact-f span {
    padding-right: 20px
}

form.contact-f .main-btn.btn-blue:hover {
    color: #243161!important
}

form.contact-f input.form-control,form.contact-f span,form.contact-f textarea {
    border: none
}

form.contact-f textarea {
    resize: none
}

h1.team-title {
    color: #f3d961;
    margin-bottom: 50px;
    font-weight: 700;
    font-size: 45px
}

footer.footer {
    background: #263c80;
    padding-top: 80px;
    padding-bottom: 60px;
    position: relative
}

footer.footer:after {
    content: "";
    background: url(/wp-content/themes/theforest/images/contact-bg.svg);
    opacity: .4;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50%
}

.payment-icons {
    margin: .75rem 0;
    display: flex;
    gap: .2rem;
    justify-content: flex-end;
    width: 100%
}

.payment-icons img {
    height: 25px
}

footer ul.social-icons {
    list-style: npne
}

footer ul.social-icons li {
    display: inline-block;
    padding: 0 6px
}

footer ul.social-icons li img {
    width: 35px
}

footer ul.social-icons li svg {
    width: 30px;
    height: 30px
}

footer ul.social-icons li svg:hover circle {
    filter: brightness(0) saturate(100%) invert(58%) sepia(76%) saturate(373%) hue-rotate(157deg) brightness(95%) contrast(82%)
}

.footer-links-grid {
    display: grid;
    grid-template-columns: 1fr;
    grid-gap: 0 15px;
    gap: 0 15px;
    margin: 15px 0 10px
}

.links-column {
    display: flex;
    flex-direction: column
}

.list-links {
    margin-bottom: 6px
}

.footer-additional-links {
    margin: 8px 0 15px
}

.footer-additional-links .list-links {
    display: flex;
    justify-content: center;
    margin: 0
}

footer .footer-email a {
    color: #fff;
    text-decoration: none;
    font-size: 24px;
    margin-top: 11px;
    display: inline-block;
    padding-right: 8px
}

img.footer-logo {
    width: 200px;
    margin-bottom: 50px
}

p.footer-para {
    color: #fff;
    font-size: 18px
}

.footer-email,ul.social-icons {
    float: inline-end
}

a.footer-email {
    margin-bottom: 50px
}

img.capital-market-img {
    width: 80%;
    float: left;
    left: -10px;
    position: relative
}

footer ul.social-icons li:last-child {
    padding-left: 0
}

rect.highcharts-background {
    fill: transparent
}

text {
    color: #fff!important;
    fill: #fff!important;
    font-family: SST!important
}

g.highcharts-grid.highcharts-yaxis-grid {
    background-color: transparent
}

path.highcharts-grid-line {
    stroke: transparent
}

g.highcharts-axis-labels.highcharts-yaxis-labels {
    display: none
}

h4.chart-calc {
    color: #e5f0f6;
    font-weight: 400;
    font-size: 23px;
    margin-bottom: 45px
}

h4.chart-calc i {
    position: relative;
    background: #bbddef6b;
    color: #ffffff7a;
    height: 30px;
    width: 30px;
    border-radius: 50%;
    text-align: center;
    font-size: 20px;
    line-height: 30px;
    -webkit-margin-start: 10px;
    margin-inline-start:10px}

.nav-pills .nav-link.active {
    background: transparent;
    border-color: #50aede
}

.nav-pills .nav-link {
    border-bottom: 2px solid #3f5091;
    border-radius: 0;
    margin-left: 10px;
    color: #fff;
    padding: 7px 20px
}

span.s-text {
    font-size: 11px;
    margin-right: 5px;
    font-weight: 500
}

h4.chart-calc i:after {
    content: "تقدّر العوائد من 4% إلى 12% بحسب حجم المخاطر التي تتحمله المحفظة، يمكنك إيداع مبلغ لمرة واحدة واستثماره أو وضع دفعات شهرية لزيادة عوائدك، فالأمر مرن بحسب هدفك. يوضّح الرسم البياني أداء المحفظة بعد خصم الرسوم، فتجد أن الرسوم التي تفرضها تمرة هي الأقل مقارنة بالعائد.";
    position: absolute;
    background: #bbddef6b;
    border-radius: 10px;
    right: 35px;
    bottom: 25px;
    font-size: 10px;
    padding: 8px 20px 12px;
    line-height: 15px;
    min-width: 300px;
    font-family: SST;
    display: none;
    text-align: justify
}

h4.chart-calc[data-lang=en] i:after {
    content: "Returns are estimated from 4% to 12%, depending on the amount of risk that the portfolio bears. You can deposit a one-time amount and invest it, or make monthly payments to increase your returns. It is flexible according to your goal. The graph shows the portfolio's performance after deducting fees. You will find that the fees charged by ATP are the lowest compared to the return.";
    left: 35px;
    bottom: 45px;
    right: 0
}

h4.chart-calc i:hover:after {
    display: block
}

.highcharts-label.highcharts-tooltip span {
    font-family: SST!important;
    color: transparent!important;
    text-align: right!important
}

.highcharts-label.highcharts-tooltip span b,.highcharts-label.highcharts-tooltip span span:first-child {
    color: #243161!important
}

.chart-config h3 {
    color: #f3d961!important;
    margin-bottom: 25px;
    font-weight: 700;
    font-size: 45px
}

.chart-config p {
    margin-top: 0;
    font-size: 19px;
    margin-bottom: 50px;
    color: #e5f0f6
}

g.highcharts-axis.highcharts-xaxis {
    display: none
}

.highcharts-color-0 path.highcharts-tracker-line {
    stroke: #f3d961;
    stroke-width: 4px
}

.highcharts-color-1 path.highcharts-tracker-line {
    stroke: #d1564d;
    stroke-width: 4px
}

.highcharts-color-2 path.highcharts-tracker-line {
    stroke: #50aede;
    stroke-width: 4px
}

path.highcharts-point.highcharts-color-0 {
    position: relative;
    fill: #f3d961;
    stroke-width: 4px
}

path.highcharts-point.highcharts-color-1 {
    position: relative;
    fill: #d1564d;
    stroke-width: 4px
}

path.highcharts-point.highcharts-color-2 {
    position: relative;
    fill: #50aede;
    stroke-width: 4px
}

image.highcharts-point.highcharts-color-0,image.highcharts-point.highcharts-color-1,image.highcharts-point.highcharts-color-2 {
    width: 26px;
    height: 26px
}

g.highcharts-axis-labels.highcharts-xaxis-labels text {
    display: none
}

svg.highcharts-root {
    border-radius: 5px
}

div#pills-tabContent .chart-container {
    position: relative
}

div#myChart,div#myChart2 {
    background: #2c3a71;
    background-image: linear-gradient(180deg,#2c3a71,#2c3a71,#2c3a71,#2c3a71,#2c3a71,#2e3d74,#2f4176,#314479,#364c7f,#3e5888,#3e5888,#4d648b);
    text-align: right;
    direction: rtl;
    border-radius: 5px
}

.years ul {
    color: #fff;
    list-style: none;
    width: 100%;
    margin-top: 7px
}

.years ul li:last-child {
    float: left
}

.years ul li {
    width: 50%;
    display: inline-block;
    color: #c4c7d4
}

.chart-line-stats {
    position: absolute;
    top: 18px;
    right: 27px;
    color: #fff
}

.chart-line-stats[data-lang=en] {
    left: 3%
}

h4.cls-nbr {
    font-size: 19px;
    margin-bottom: 20px
}

p.cls-para {
    font-size: 15px;
    padding-bottom: 3px;
    font-weight: 100
}

h4.cls-nbr.cls-color-1 {
    color: #f3d961
}

h4.cls-nbr.cls-color-2 {
    color: #d1564d
}

h4.cls-nbr.cls-color-3 {
    color: #50aede;
    margin-bottom: 0
}

.carousel-indicators {
    bottom: -50px
}

.carousel-indicators button {
    width: 15px!important;
    height: 15px!important;
    border-radius: 15px;
    background-color: #ffffff54!important;
    margin: 0 5px;
    border: none!important
}

.carousel-indicators button.active {
    width: 15px!important;
    height: 15px!important;
    border-radius: 15px;
    background: #fff!important;
    border: none
}

img.about-img {
    position: relative
}

@keyframes MoveUpDown {
    0%,to {
        bottom: 0
    }

    50% {
        bottom: 30px
    }
}

h1.wallet-title:hover img.about-v-t-icon {
    transform: rotate(1turn)
}

img.about-v-t-icon {
    transition: transform 1.5s ease-in-out
}

footer ul.social-icons li img:hover {
    filter: brightness(0) saturate(100%) invert(58%) sepia(76%) saturate(373%) hue-rotate(157deg) brightness(95%) contrast(82%)
}

img.video-play {
    z-index: 999!important
}

@keyframes pulse-border {
    0% {
        transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);
        opacity: 1
    }

    to {
        transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
        opacity: 0
    }
}

a#play-video:before {
    content: "";
    position: absolute;
    z-index: 0;
    left: 50%;
    top: calc(50% + 30px);
    transform: translateY(-50%);
    display: block;
    width: 70px;
    height: 70px;
    background: #ffffff61;
    border-radius: 50%;
    animation: pulse-border 1.5s ease-out infinite;
    z-index: 1
}

.video-overlay {
    position: fixed;
    z-index: -1;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0,0,0,.8);
    opacity: 0;
    transition: all .5s ease
}

.video-overlay.open {
    position: fixed;
    z-index: 9999999999;
    opacity: 1
}

.video-overlay-close {
    position: absolute;
    z-index: 1000;
    top: 15px;
    right: 20px;
    font-size: 36px;
    line-height: 1;
    font-weight: 400;
    color: #fff;
    text-decoration: none;
    cursor: pointer;
    transition: all .2s
}

.video-overlay-close:hover {
    color: #fa183d
}

.video-overlay iframe {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    box-shadow: 0 0 15px rgba(0,0,0,.75)
}

footer.footer .container {
    z-index: 9999;
    position: relative
}

.chart-config a {
    text-decoration: none
}

g.highcharts-legend.highcharts-no-tooltip {
    display: none
}

.chart-config ul li a {
    background: #243161;
    display: inline-block;
    padding: 10px;
    border-radius: 5px;
    color: #fff;
    font-size: 12px;
    border: 1px solid #374b98
}

.chart-config ul li {
    display: inline-block;
    margin-left: 7px;
    margin-bottom: 7px
}

.chart-config h3 {
    color: #d6c263
}

.chart-config p {
    color: #fff;
    margin-top: 11px
}

ul.wallet_types {
    margin-top: 20px
}

.chart-config h4 {
    font-size: 13px;
    color: #fff
}

.rang-sliders label,.rang-sliders[data-lang=en] label {
    width: 50%;
    display: inline-block
}

label.numbers_ranged {
    text-align: left
}

span.numbers_ranged_chng input {
    text-align: left;
    background: #243161;
    color: #f3d961;
    border: none;
    width: 100%;
    padding-left: 7px;
    font-weight: 500
}

label.numbers_ranged {
    display: inline-flex
}

label.numbers_ranged[dir=ltr] {
    display: inline-flex;
    flex-direction: row-reverse
}

label.numbers_ranged {
    background: rgba(80,174,222,.2);
    border: 1px solid #50aede;
    border-radius: 5px;
    width: 35%;
    padding: 3px 3px 6px 15px;
    float: left
}

span.numbers_ranged_chng input {
    background: transparent
}

span.numbers_ranged_chng input::-webkit-inner-spin-button,span.numbers_ranged_chng input::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
}

label.blacked_ranged.bld_l {
    text-align: left
}

.single-rang {
    margin-top: 30px;
    overflow: hidden;
    display: block
}

range-slider:before {
    height: 6px!important;
    border-radius: 35px;
    background: linear-gradient(#f5e59a,#f5e59a) 0/var(--value-percent,0) 100% no-repeat #3f5091!important
}

.chart-config h4 {
    font-size: 16px;
    font-weight: 400
}

.chart-config ul li {
    padding: 0
}

.chart-config ul li a {
    padding: 7px 25px 14px;
    font-size: 16px
}

.chart-config ul li a .hidden {
    display: none
}

.chart-config ul li .c-active i {
    display: inline-block;
    padding-left: 5px;
    color: #f3d961
}

.chart-config ul li .c-active {
    background: rgba(80,174,222,.2);
    border-color: #50aede
}

.thumb {
    background: #ffb400!important;
    border: 2px solid #ffd200!important;
    width: 20px!important;
    height: 20px!important;
    bottom: 2px!important
}

label.numbers_ranged {
    color: #f3d961;
    font-weight: 700
}

label.blacked_ranged.bld_l,label.blacked_ranged.bld_r {
    font-weight: 700;
    color: #6282ff
}

label.blacked_ranged.bld_r {
    display: flex;
    gap: .25rem;
    width: 100%
}

.rang-sliders {
    margin-bottom: 75px
}

.rang-sliders label {
    color: #fff
}

output {
    display: none
}

range-slider {
    --element-height: 24px;
    --track-height: 3px;
    --thumb-size: 16px;
    position: relative;
    display: flex;
    align-items: center;
    height: var(--element-height);
    width: 100%;
    min-width: 130px;
    margin: 2px;
    overflow: visible;
    cursor: pointer;
    touch-action: none
}

range-slider:focus {
    outline: 0
}

range-slider[disabled] {
    filter: grayscale(1);
    opacity: .8
}

range-slider:before {
    content: "";
    display: block;
    width: 100%;
    height: var(--track-height);
    border-radius: calc(var(--track-height)/2);
    background: linear-gradient(#6221ea,#6221ea) 0/var(--value-percent,0) 100% no-repeat #c6afe5
}

range-slider:focus .thumb {
    box-shadow: 0 0 0 .3em rgba(98,33,234,.2)
}

range-slider.touch-active .thumb-wrapper .thumb {
    box-shadow: none;
    transform: scale(1.5)
}

input.savings-range::-webkit-slider-thumb {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    -webkit-appearance: none;
    background: #ffb400;
    top: -2px;
    position: relative
}

input.savings-range[dir=rtl] {
    border-radius: 8px;
    height: 8px;
    width: 100%;
    background: linear-gradient(270deg,#f5e59a 0,#f5e59a 4%,#3f5091 0,#3f5091)
}

input.savings-range[dir=ltr] {
    border-radius: 8px;
    height: 8px;
    width: 100%;
    background: linear-gradient(90deg,#f5e59a 0,#f5e59a 4%,#3f5091 0,#3f5091)
}

input.savings-range::-webkit-slider-thumb {
    margin-right: 1px
}

input.savings-range {
    padding-left: 2px
}

input#savings[dir=rtl] {
    background: linear-gradient(270deg,#f5e59a 0,#f5e59a 3%,#3f5091 0,#3f5091)
}

input#savings[dir=ltr] {
    background: linear-gradient(90deg,#f5e59a 0,#f5e59a 3%,#3f5091 0,#3f5091)
}

.thumb {
    background: #6221ea;
    border-radius: 50%;
    width: var(--thumb-size);
    height: var(--thumb-size);
    position: absolute;
    bottom: calc(var(--element-height)/2 - var(--thumb-size)/2);
    left: var(--value-percent,0);
    margin-left: calc(var(--thumb-size)/2*-1);
    transition: transform .2s ease;
    will-change: transform;
    pointer-events: none
}

.thumb-wrapper {
    position: absolute;
    left: calc(var(--thumb-size)/2);
    right: calc(var(--thumb-size)/2);
    bottom: 0;
    height: 0;
    overflow: visible
}

p.cta-para,p.why-invest-para {
    color: #666;
    line-height: 31px;
    font-weight: 500
}

p.cta-para {
    max-width: 590px;
    margin: 0 auto 40px
}

p.footer-para a {
    color: #fff;
    text-decoration: none
}

html {
    scroll-behavior: smooth
}

.header.fixed {
    position: fixed;
    width: 100%;
    background: #fff;
    box-shadow: 0 4px 20px -10px #c7c6c6;
    height: 103px;
    padding: 0;
    top: 0
}

section.header {
    z-index: 99999
}

.header.fixed img.main-logo {
    width: 130px
}

.header.fixed .main-navbar {
    padding: 0
}

.about-s-img a,.capital-market a {
    text-decoration: none
}

img.Stamp {
    -webkit-margin-end: 15px;
    margin-inline-end:15px}

.capital-market {
    width: 80%;
    float: inline-end;
    display: inline-flex
}

.capital-market img {
    width: 100%;
    left: -10px;
    position: relative
}

.capital-market[dir=ltr] img {
    right: -10px
}

.capital-market[dir=ltr] img.Stamp,.capital-market[dir=rtl] img.Stamp {
    width: 95%;
    right: 0
}

span.msg-error-div {
    border-radius: 3px!important;
    box-shadow: 0 0 0 transparent;
    position: absolute;
    right: 25px;
    top: -25px;
    padding: 0 10px!important;
    height: 32px;
    color: #243161;
    background: #f3d961!important;
    line-height: 30px;
    white-space: nowrap;
    font-size: 12px;
    text-align: right
}

span.msg-error-div:before {
    width: 0;
    height: 0;
    right: 10px;
    bottom: -14px;
    content: "";
    position: absolute;
    border: 5px solid transparent;
    border-top: 10px solid #f3d961;
    z-index: 9
}

span.input-group-text {
    border-radius: 10px!important;
    border-end-end-radius: 0!important;
    border-start-end-radius: 0!important
}

#contact-form textarea {
    border-radius: 10px!important
}

label.blacked_ranged.bld_r {
    float: right;
    font-weight: 500;
    font-size: 15px
}

label.blacked_ranged.bld_l {
    float: left;
    font-weight: 500;
    font-size: 15px
}

.rang-sliders label {
    color: #b7c0dd;
    font-size: 18px;
    margin-bottom: 10px;
    font-weight: 500
}

label.numbers_ranged {
    color: #f3d961!important
}

.chart-config h4 {
    color: #b7c0dd;
    font-size: 18px;
    font-weight: 500
}

.chart-config p {
    margin-bottom: 40px
}

.fix-logo {
    display: none
}

.header.fixed img.fix-logo {
    display: block;
    width: 130px
}

section.page-hero {
    background: #192551;
    color: #fff;
    height: 800px;
    position: relative
}

section.page-hero .container {
    height: 100%;
    display: grid;
    align-items: center
}

main.page ul.navbar-nav.left-nav li a {
    color: #f7f7f7
}

main.page ul.navbar-nav.left-nav li a.btn-login {
    color: #243161
}

section.header.fixed a.nav-link {
    color: #243161!important
}

img.phone-hero {
    position: absolute;
    bottom: -55px;
    height: 68vh;
    z-index: 9;
    right: 13%
}

h1.page-hero-title {
    font-size: 37px;
    margin-bottom: 10px
}

h4.page-hero-sub-title {
    color: #50aede;
    font-size: 23px;
    font-weight: 400;
    margin-bottom: 25px
}

p.page-hero-p {
    font-size: 18px;
    line-height: 30px;
    font-weight: 100
}

p.page-hero-p.p-yellow {
    color: #f5e087;
    margin-top: 25px;
    margin-bottom: 40px
}

section.page-hero .content {
    padding-top: 50px
}

section.page-hero a.main-btn:hover {
    background: #50aede;
    color: #fff
}

section.page-hero .content {
    z-index: 9;
    position: relative
}

.main-title {
    position: relative;
    z-index: 999
}

h1.atp-steps-title {
    display: none
}

h4.step-nbr {
    background: #dfe0eb;
    display: inline-block;
    width: 40px;
    height: 40px;
    line-height: 37px;
    border-radius: 50%;
    text-align: center
}

h2.step-title,h4.step-nbr {
    color: #23397e;
    margin-bottom: 10px
}

h2.step-title {
    font-size: 26px;
    font-weight: 700
}

p.step-para {
    color: #24316199;
    font-size: 15px;
    font-weight: 500
}

img.step-img {
    height: 300px;
    width: 185px;
    margin: 0 auto
}

.hide-mobile.blank-step {
    height: 170px
}

.step-box {
    display: grid;
    padding: 0 30px
}

.hide-desktop {
    display: none
}

section.atp-steps {
    position: relative;
    background: url(/wp-content/themes/theforest/images/steps-line.svg);
    background-repeat: no-repeat;
    background-size: 90%;
    background-position: 0 0;
    min-height: 90vh
}

.container-steps {
    width: 76.9%;
    left: .6%;
    position: relative;
    margin: 0 auto
}

.step-box.step-img-bottom img.step-img {
    margin-top: 30px
}

.step-box.step-img-top img.step-img {
    top: -30px;
    position: relative
}

section.fruits-of-investment {
    background: #fff;
    position: relative
}

section.fruits-of-investment:before {
    content: "";
    position: absolute;
    background: url(/wp-content/themes/theforest/images/fruits-bg.svg);
    background-size: cover;
    background-position: 50%;
    height: 130%;
    width: 100%;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1
}

h1.fruits-of-investment-title {
    color: #243161;
    font-size: 40px;
    margin-bottom: 50px;
    font-weight: 700
}

.foi-card {
    background: #fff;
    min-height: 380px;
    margin: 13px 0;
    position: relative;
    z-index: 9
}

img.foi-img {
    width: 100px;
    max-height: 100px;
    margin-bottom: 25px
}

h4.foi-title {
    color: #23397e;
    font-size: 25px;
    font-weight: 700;
    margin-bottom: 25px
}

p.foi-para {
    color: #24316199;
    font-size: 15px;
    font-weight: 500;
    line-height: 25px
}

.foi-card-content {
    position: absolute;
    top: calc(50%);
    transform: translateY(-50%);
    width: 85%;
    margin: 0 auto;
    left: 0;
    right: 0
}

section.fruits-of-investment .col-md-6:nth-child(2) .foi-card-content {
    top: calc(50% - 10px)!important
}

section.fruits-of-investment .col-md-6:nth-child(4) .foi-card-content {
    top: calc(50% - -6px)!important
}

section.investment-wallets {
    background: #243161;
    color: #fff;
    position: relative;
    background-image: url(/wp-content/themes/theforest/images/investment-wallets-bg.svg);
    background-position: top;
    background-size: 100%;
    background-repeat: no-repeat
}

section.investment-wallets:after {
    content: "";
    position: absolute;
    background: url(/wp-content/themes/theforest/images/calc-shape-t.svg);
    background-position: 50%;
    background-size: cover;
    background-repeat: no-repeat;
    height: 140px;
    width: 100%;
    z-index: 99;
    top: 0;
    left: 0;
    right: 0
}

section.investment-wallets:before {
    content: "";
    position: absolute;
    background: url(/wp-content/themes/theforest/images/iw-bg-bt.svg);
    background-size: cover;
    background-repeat: no-repeat;
    height: 500px;
    width: 100%;
    z-index: 1;
    bottom: 0
}

section.investment-wallets .main-title {
    width: 60%;
    display: block;
    margin: 0 auto 40px
}

input#wallet-range::-webkit-slider-thumb {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    -webkit-appearance: none;
    background: #1b9fe2
}

input#wallet-range {
    border-radius: 8px;
    height: 8px;
    width: 100%;
    background: linear-gradient(270deg,#50aede 0,#50aede 0,#3f5091 0,#3f5091)
}

input[type=range]::-webkit-slider-runnable-track {
    height: 13px;
    -webkit-appearance: none;
    background: transparent
}

.wallet-range {
    margin-bottom: 35px
}

h1.iw-title {
    font-weight: 700;
    margin-bottom: 25px
}

p.iw-para {
    color: #ffffffb3;
    font-size: 19px
}

h1.iw-wallet-title {
    color: #f3d961;
    font-size: 25px;
    margin-bottom: 15px;
    text-align: center;
    font-weight: 700
}

p.iw-wallet-para {
    text-align: center;
    font-size: 16px
}

.wallets-chart {
    display: block;
    margin: 30px auto 0;
    z-index: 9999;
    position: relative;
    width: 70%
}

svg.page-hero {
    position: absolute;
    top: 18.2%;
    right: 8%
}

section.atp-steps {
    background: transparent;
    min-height: 100vh
}

.container-steps {
    width: 75.9%
}

h1.iw-title {
    display: inline-block;
    position: relative
}

h1.iw-title:before {
    content: "";
    background: url(/wp-content/themes/theforest/images/arrow.webp);
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    width: 40px;
    height: 40px;
    right: -30px;
    top: -8px;
    opacity: 0
}

@keyframes animation2 {
    0% {
        right: -110px;
        top: -90px
    }

    to {
        right: -30px;
        top: -8px
    }
}

h1.iw-title.arrow-animation:before {
    animation-name: animation2;
    animation-duration: 1s;
    opacity: 1
}

input#fake-wallet-range {
    border-radius: 8px;
    height: 8px;
    width: 100%;
    background: linear-gradient(270deg,#50aede 0,#50aede 13%,#3f5091 0,#3f5091);
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0
}

input#fake-wallet-range[dir=ltr] {
    background: linear-gradient(90deg,#50aede 0,#50aede 13%,#3f5091 0,#3f5091)
}

input#fake-wallet-range::-webkit-slider-thumb {
    display: none
}

.wallet-range {
    position: relative
}

input#wallet-range {
    z-index: 9;
    position: relative;
    width: 76%;
    margin: 0 auto;
    display: block
}

#button-go-top {
    display: inline-block;
    background-color: #f3d961;
    width: 40px;
    height: 40px;
    text-align: center;
    border-radius: 50px;
    position: fixed;
    bottom: 30px;
    right: 30px;
    transition: background-color .3s,opacity .5s,visibility .5s;
    opacity: 0;
    visibility: hidden;
    z-index: 1000;
    text-decoration: none
}

#button-go-top:after {
    content: "\f077";
    font-family: FontAwesome;
    font-weight: 400;
    font-style: normal;
    font-size: 15px;
    line-height: 42px;
    color: #243161
}

#button-go-top:hover {
    cursor: pointer
}

#button-go-top:active,#button-go-top:hover {
    background-color: #5fddd3
}

#button-go-top.show {
    opacity: 1;
    visibility: visible
}

ul.navbar-nav.left-nav li a.btn-login {
    min-width: 150px;
    text-align: center
}

a.btn-know-more {
    display: inline-flex;
    align-items: flex-end
}

a.btn-know-more i {
    padding-right: 10px;
    top: 3px;
    position: relative
}

.years ul li:first-child {
    text-align: right
}

.years ul li:last-child {
    text-align: left
}

section.about:before {
    display: none
}

path.highcharts-crosshair.highcharts-crosshair-category {
    z-index: 99999!important;
    stroke-width: 2px!important;
    position: relative!important
}

canvas#withdrawal {
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    top: -80px;
    z-index: 0;
    top: 13%;
    width: 53%
}

canvas#withdrawal-desktop {
    width: 72%;
    position: absolute;
    top: 20vh
}

.header.page-2.fixed img.main-logo {
    display: none
}

.page-2 path#primary {
    stroke: #fff!important
}

.header.page-2.fixed path#primary,.header.page-2.mobile-nav path#primary {
    stroke: #000!important
}

.header.page-2.mobile-nav img.main-logo {
    display: none
}

.header.page-2.mobile-nav img.fix-logo {
    display: block;
    width: 100px;
    -webkit-margin-start: 20px;
    margin-inline-start:20px}

p.about-p {
    margin-bottom: 30px!important
}

.modal {
    z-index: 99999
}

h1.invest-title,h1.security-title {
    font-size: 35px
}

img#shariyah-img {
    max-height: 450px;
    width: auto;
    display: block;
    margin: 0 auto
}

img.shariyah-logo {
    width: 50px
}

.blog-body:before,section.invest:before {
    min-height: 680px
}

div#active-quote {
    position: relative
}

img.team-slider-btn[dir=rtl] {
    left: calc(var(--bs-gutter-x) * .5)
}

img.team-slider-btn[dir=ltr],img.team-slider-btn[dir=rtl] {
    cursor: pointer;
    width: 35px!important;
    position: absolute;
    top: 3px;
    z-index: 9
}

img.team-slider-btn[dir=ltr] {
    right: calc(var(--bs-gutter-x) * .5)
}

.shariyah-btn-wrapper {
    text-align: start
}

.shariyah-btn {
    background: #50aede;
    color: #fff!important;
    text-decoration: none;
    border-radius: 50px;
    padding: 10px 40px 16px;
    font-weight: 700;
    border: none;
    display: inline-block;
    margin-top: 26px
}

.shariyah-btn:hover {
    background: #243161
}

a.btn-know-more i {
    top: 2.3px
}

section.financial-records {
    position: relative;
    overflow-x: hidden
}

h4.financial-ul-title {
    color: #50aede;
    font-size: 20px;
    font-weight: 400;
    margin-top: 15px;
    margin-bottom: 10px
}

ul.financial-ul {
    list-style: none;
    display: inline-flex;
    font-size: 13px;
    font-weight: 500;
    color: #23397e
}

section.financial-records .invest-content {
    padding: 0
}

section.financial-records p.invest-para {
    -webkit-padding-end: 100px;
    padding-inline-end:100px}

li.financial-ul-list {
    -webkit-padding-start: 17px;
    padding-inline-start:17px}

li.financial-ul-list:first-child {
    -webkit-padding-start: 0;
    padding-inline-start:0}

img.financial-records-img {
    width: 100%
}

img.tick-square {
    width: 20px
}

.download-record {
    background: #ececec
}

section.atp-structure {
    background: #f6f6f9;
    background: linear-gradient(180deg,#f4f5f8,#fff)
}

.download-record {
    padding: 5px;
    border-radius: 50px;
    margin-top: 22px;
    height: 50px;
    width: 60%
}

select#slct {
    background: #ececec;
    color: #243161;
    font-weight: 500;
    border: none;
    margin: 0;
    box-sizing: border-box;
    background-image: linear-gradient(45deg,transparent 50%,#243161 0),linear-gradient(135deg,#243161 50%,transparent 0),linear-gradient(90deg,#ececec,#ececec);
    background-position: calc(100% - 20px) calc(1em + 2px),calc(100% - 15px) calc(1em + 2px),calc(100% - 2.5em) .5em;
    background-size: 5px 5px,5px 5px,1px 1.5em;
    background-repeat: no-repeat;
    padding: .4em 1em .5em;
    line-height: 1.5em
}

.down-arrow {
    float: inline-start;
    line-height: 1.5em;
    padding: .4em 1.5em .5em 0
}

select#slct:focus {
    background-image: linear-gradient(45deg,#243161 50%,transparent 0),linear-gradient(135deg,transparent 50%,#243161 0),linear-gradient(90deg,#ececec,#ececec);
    background-position: calc(100% - 15px) 1em,calc(100% - 20px) 1em,calc(100% - 2.5em) .5em;
    background-size: 5px 5px,5px 5px,1px 1.5em;
    background-repeat: no-repeat;
    border-color: #ececec;
    outline: 0
}

a.main-btn.btn-download {
    position: relative;
    padding: 0;
    background: #50aede;
    color: #fff;
    height: 50px;
    float: inline-end;
    top: -5px;
    left: -5px;
    line-height: 43px;
    width: 130px;
    text-align: center
}

a.main-btn.btn-download[dir=ltr] {
    left: -30px;
    float: inline-start
}

a.main-btn.btn-download img {
    -webkit-margin-start: 2px;
    margin-inline-start:2px}

h1.atp-structure-title {
    color: #243161;
    font-size: 40px;
    margin-bottom: 20px;
    font-weight: 700
}

p.atp-structure-para {
    font-size: 17px;
    width: 70%;
    margin: 0 auto 80px;
    color: #000000ad;
    line-height: 30px
}

h1.financial-activities-title {
    color: #243161;
    font-size: 30px;
    margin-bottom: 20px;
    font-weight: 700
}

p.financial-activities-para {
    font-size: 17px;
    width: 70%;
    margin: 0 auto 50px;
    color: #000000ad;
    line-height: 30px
}

.financial-activitie-box {
    text-align: center;
    background: #ecf9ff;
    background: linear-gradient(180deg,#ecf9ff,#fff 50%,#fff);
    padding: 30px;
    min-height: 305px
}

h5.f-a-box-title {
    color: #23397e;
    padding-top: 15px;
    font-weight: 600;
    font-size: 19px
}

h5.f-a-subbox-title {
    color: #243161;
    padding-top: 20px;
    padding-bottom: 13px;
    font-size: 16px;
    font-weight: 500
}

p.f-a-subbox-para {
    color: #243161b5;
    font-size: 15px;
    line-height: 25px
}

.financial-activitie-box img {
    width: 55px
}

img.pyramid-img {
    width: 50%
}

ul.atp-structure {
    width: 50%;
    list-style: none;
    display: grid
}

.structure-content {
    display: inline-flex;
    margin-right: -2.8%
}

h5.pyramid-title {
    color: #23397e;
    font-size: 20px;
    font-weight: 600;
    padding-bottom: 10px
}

p.pyramid-para {
    color: #243161d6;
    font-size: 16px
}

ul.atp-structure li {
    position: relative
}

ul.atp-structure li:before {
    content: "";
    position: absolute;
    right: -37%;
    top: 30px;
    background: #23397e;
    width: 35%;
    height: 1px;
    z-index: 1
}

ul.atp-structure[data-lang=en] li:before {
    left: -37%
}

img.pyramid-img {
    z-index: 2
}

ul.atp-structure li:after {
    content: "";
    position: absolute;
    right: -2%;
    top: 28px;
    background: #23397e;
    height: 5px;
    width: 5px;
    border-radius: 10px
}

ul.atp-structure[data-lang=en] li:after {
    left: -2%
}

ul.atp-structure li:nth-child(2) {
    margin-right: -5%
}

ul.atp-structure li:first-child {
    margin-right: -15%
}

ul.atp-structure li:nth-child(3) {
    margin-right: 5%
}

ul.atp-structure li:nth-child(4) {
    margin-right: 15%
}

ul.atp-structure li {
    width: 100%
}

.pdf-home-btn-download-div {
    width: 100%!important;
    position: relative!important;
    display: inline-block;
    margin-top: 40px
}

.pdf-home-btn-download-div img {
    width: 20px!important
}

a.main-btn.btn-download {
    width: auto;
    padding: 0 30px
}

.pdf-home-btn-download-div {
    z-index: 999;
    position: relative
}

p.footer-para {
    width: 80%
}

.structure-btn-wrapper a.shariyah-btn {
    margin: 0 auto;
    display: block;
    text-align: center;
    width: 20%
}

.structure-btn-wrapper {
    margin-top: 20px
}

a.nav-link.btn-login-1 {
    border: 2px solid #f3d961;
    color: #243161;
    border-radius: 50px;
    margin-right: 10px;
    margin-left: 0;
    font-weight: 700;
    padding: 8px 20px 14px;
    min-width: 150px;
    text-align: center
}

img.blog-hero-bg-img-1 {
    position: absolute;
    height: 100%;
    right: 0;
    top: 0
}

img.blog-hero-coin-r {
    right: 0
}

img.blog-hero-coin-l,img.blog-hero-coin-r {
    position: absolute;
    bottom: 40px;
    height: 150px;
    width: 180px
}

img.blog-hero-coin-l {
    left: 0
}

.justify-center {
    justify-content: center
}

.read-more-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-gap: 1.5rem;
    gap: 1.5rem;
    margin-bottom: 2rem
}

.mb-0 {
    margin-bottom: 0
}

.mb-1 {
    margin-bottom: 4px
}

section.blog-hero {
    height: 40vh;
    position: relative;
    background: #192551;
    color: #fff
}

section.blog-hero .container {
    height: 100%;
    display: grid;
    align-items: end;
    padding-bottom: 100px
}

img.blog-hero-img {
    position: absolute;
    bottom: 0
}

h1.blog-hero-title {
    z-index: 10;
    position: relative;
    font-size: 45px;
    margin-bottom: 15px
}

p.blog-hero-p {
    color: #f2f2f2;
    margin-bottom: 40px;
    z-index: 10;
    position: relative
}

.search-div {
    background: #fff;
    border-radius: 5px;
    width: 60%;
    padding: 0 10px;
    display: inline-flex;
    position: relative;
    align-items: center
}

input.search {
    margin: 0;
    border: none;
    background: transparent;
    line-height: 50px;
    width: 80%;
    font-size: 15px
}

button.search-btn {
    border: none;
    background: #23397e;
    color: #f7f7f7;
    border-radius: 50px;
    padding: 10px;
    float: left;
    width: 20%;
    line-height: 0px
}

button.search-btn:hover {
    background: #50aede
}

img.search-icon {
    width: 20px
}

section.special-post {
    padding-top: 50px
}

.blog-s-title {
    display: flex;
    align-items: flex-end;
    gap: 10px
}

.mb-30 {
    margin-bottom: 30px
}

.blog-s-title img {
    width: 30px;
    position: relative
}

.blog-s-title h4 {
    font-size: 22px;
    color: #243161;
    margin-bottom: 5px
}

img.post-thumbnail {
    width: 100%
}

span.min-audio-card {
    border: 2px solid #f5f5f5;
    border-radius: 50px;
    display: flex;
    padding: 5px 10px;
    align-self: center
}

.min-audio {
    display: flex;
    float: left
}

img.audio-s-icon,img.clock-s-icon {
    width: 20px!important
}

img.clock-s-icon {
    margin-left: 5px
}

h4.minute-text {
    font-size: 14px;
    font-weight: 400;
    color: #3f5091
}

.main-special-post img.post-thumbnail {
    margin-bottom: 20px;
    min-height: 227px;
    object-fit: cover;
    border-radius: 1rem
}

h6.post-date {
    margin-bottom: 10px
}

h6.post-date,h6.post-date-inner {
    color: #8088a4;
    font-size: 15px;
    font-weight: 400
}

h6.post-date-inner {
    margin-bottom: 1rem
}

.mb-2 {
    margin-bottom: .5rem
}

h4.post-title {
    color: #333f51;
    margin-bottom: 6px;
    font-size: 20px
}

p.post-content {
    color: #8088a4;
    font-size: 14px;
    margin-bottom: 1rem;
    font-size: 1.125rem
}

p.post-content-side {
    color: #8088a4;
    font-size: 14px
}

.post-tag,span.min-audio-card:first-child {
    margin-left: 5px
}

.post-tag {
    background: #f5f5f5;
    font-size: 13px;
    color: #3f5091;
    font-weight: 500;
    padding: 0 14px 4px
}

.post-tags {
    display: flex
}

.post-tag.active {
    background: #50aede1a;
    color: #50aede
}

.second-special-post h6.post-date {
    margin-top: 0;
    font-size: 14px
}

.second-special-post h4.post-title {
    font-size: 16px;
    margin-top: 5px;
    line-height: 23px
}

.second-special-post p.post-content {
    font-size: 12px
}

.second-special-post {
    margin-bottom: 25px;
    height: 224px
}

.second-special-post .row {
    height: 100%
}

.second-special-post img.post-thumbnail {
    height: 100%;
    max-height: 224px;
    object-fit: cover;
    border-radius: 5px
}

.second-special-post span.min-audio-card {
    padding: 4px 8px
}

.second-special-post h4.minute-text {
    font-size: 13px
}

.second-special-post img.audio-s-icon,.second-special-post img.clock-s-icon {
    width: 18px
}

.second-special-post span.min-audio-card:first-child {
    margin-left: 4px
}

hr.blog {
    color: #afafaf;
    margin-top: 50px
}

.second-special-post:last-child {
    margin-bottom: 0
}

span.blog-filter-card {
    border: 2px solid #f5f5f5;
    border-radius: 50px;
    display: flex;
    padding: 5px 10px;
    align-self: center;
    cursor: pointer
}

span.blog-filter-card img.filter-drop-icon {
    margin-right: 5px;
    width: 15px
}

h6.filter-title {
    color: #aab1cc;
    font-weight: 400;
    margin-bottom: 12px
}

.filter-blog {
    display: flex
}

.filter-block {
    float: left
}

.post-tags a {
    text-decoration: none
}

.post-tag a {
    color: #3f5091!important
}

.post-tag.active a {
    color: #50aede!important
}

section.latest-post {
    padding-top: 50px;
    padding-bottom: 70px
}

img.post-blog-thumbnail {
    width: 100%;
    margin-bottom: 15px;
    border-radius: 10px;
    aspect-ratio: 1.77/1
}

hr.blog-pagination {
    color: #afafaf;
    margin-top: 60px;
    margin-bottom: 25px
}

button.btn.btn-pagination-prev {
    color: #667085;
    float: right
}

button.btn.btn-pagination-prev img {
    margin-left: 5px;
    width: 12px
}

button.btn.btn-pagination-next {
    color: #667085;
    float: left
}

button.btn.btn-pagination-next img {
    margin-right: 5px;
    width: 12px
}

.link-container {
    display: inline-block;
    width: 100%
}

li.page--link-next {
    list-style: none;
    float: left
}

li.page--link-prev {
    list-style: none;
    float: right
}

.pagination-block,li.page--link a {
    text-align: center
}

li.page--link a {
    border: 2px solid #f2f2f2;
    height: 35px;
    width: 35px;
    display: inline-table;
    line-height: 0;
    font-weight: 500;
    padding-top: 14px;
    list-style: none
}

li.page--link {
    list-style: none;
    display: inline-block
}

.page--link a {
    color: #1d1d1b!important;
    text-decoration: none
}

h4.post-title a {
    text-decoration: none;
    color: #333f51
}

.post-title-main {
    font-size: 2rem!important
}

.page--link.page--link--current {
    background: url(/wp-content/themes/theforest/images/pagination-active.webp);
    border: none;
    color: #fff!important;
    background-size: cover;
    height: 33px;
    width: 33px
}

.page--link a:hover {
    background: #52afdf;
    border-color: #52afdf
}

span.blog-filter-card {
    margin-left: 4px
}

span.blog-filter-card:last-child {
    margin-left: 0
}

.blog img.post-blog-thumbnail {
    min-height: 313px;
    object-fit: cover;
    object-position: center
}

.dropdown-container {
    position: relative;
    max-width: 240px
}

.dropdown-container .dropdown-toggle label {
    cursor: pointer;
    width: 100%
}

.dropdown-container .dropdown-toggle:active,.dropdown-container .dropdown-toggle:focus,.dropdown-container .dropdown-toggle:hover {
    background-color: #e6ecff;
    color: #263c80;
    border-radius: 50px
}

.dropdown-container .dropdown-menu {
    width: 100%;
    border-radius: 10px;
    box-shadow: 0 0 4px -2px rgba(0,0,0,.5);
    margin-top: 17px;
    position: absolute;
    right: 0;
    top: 100%;
    display: none;
    background-color: #fff;
    z-index: 10;
    padding: 0
}

.dropdown-container .dropdown-menu ul {
    list-style: none;
    padding: 0;
    margin: 0;
    overflow: hidden;
    border-radius: 10px;
    z-index: 10
}

.dropdown-container .dropdown-menu a {
    text-decoration: none;
    display: block;
    color: #333f51;
    font-size: 15px;
    padding: 10px;
    font-weight: 400;
    transition: all .3s ease-in-out
}

.dropdown-container .dropdown-menu a:active,.dropdown-container .dropdown-menu a:focus,.dropdown-container .dropdown-menu a:hover {
    background-color: #263c80;
    color: #fff
}

.dropdown-menu,.dropdown-toggle {
    position: relative
}

.dropdown-menu {
    z-index: 10
}

.dropdown-open .dropdown-menu.dropdown-active {
    display: block
}

.dropdown-container.dropdown-open .dropdown-toggle {
    background-color: #e6ecff;
    color: #263c80;
    border-radius: 50px
}

.filter-blog .dropdown-toggle:after {
    display: none
}

.dropdown-container {
    margin-left: 4px
}

.dropdown-container:last-child {
    margin-left: 0
}

li.page--link.page--link--current:hover {
    background: url(/wp-content/themes/theforest/images/pagination-active.webp);
    background-size: cover
}

section.single-hero {
    height: 55vh;
    position: relative;
    background: #192551;
    color: #fff
}

section.single-hero .container {
    height: 100%;
    display: grid;
    align-items: center
}

.breadcrumb-item+.breadcrumb-item:before {
    content: ">"
}

section.single-hero .content,section.single-hero nav.breadcrumbs.large-font {
    text-align: center
}

section.single-hero ol.breadcrumb {
    display: inline-flex;
    margin-bottom: 15px
}

section.single-hero ol.breadcrumb li {
    font-weight: 500
}

section.single-hero ol.breadcrumb li a {
    color: #8692c0;
    text-decoration: none
}

section.single-hero li.breadcrumb-item.active {
    color: #c7cde4
}

h4.single-post-title {
    font-size: 35px;
    margin-bottom: 20px
}

h6.post-single-date {
    color: #f3d961;
    font-weight: 400;
    margin-bottom: 15px
}

section.single-hero .post-tags {
    display: inline-flex
}

section.single-hero .post-tags .post-tag {
    font-size: 15px
}

section.single-hero:before {
    background: url(/wp-content/themes/theforest/images/single-header-r.webp);
    background-size: contain;
    background-repeat: no-repeat
}

section.single-hero:after,section.single-hero:before {
    content: "";
    position: absolute;
    width: 180px;
    height: 150px;
    bottom: 40px
}

section.single-hero:after {
    background: url(/wp-content/themes/theforest/images/single-header-l.webp);
    background-size: contain;
    background-repeat: no-repeat;
    left: 0
}

img.single-thumbnail-img {
    width: 100%;
    margin-bottom: 40px
}

.single-post-div {
    position: relative;
    margin-top: -120px;
    z-index: 9
}

.post-content {
    color: #667085;
    font-size: 16px;
    line-height: 30px
}

.post-content img {
    width: 100%;
    height: auto
}

hr.hr-single-post {
    color: #667085;
    margin-top: 40px;
    margin-bottom: 40px
}

img.author-img {
    width: 55px;
    margin-left: 10px
}

.div-author {
    display: inline-flex;
    align-items: center
}

h6.author-name {
    font-size: 18px;
    color: #101828
}

p.author-info {
    color: #667085;
    font-size: 17px;
    padding-top: 8px
}

.btn-share {
    text-decoration: none;
    border: 2px solid #d0d5dd;
    border-radius: 10px;
    color: #344054;
    font-weight: 500;
    font-size: 16px;
    padding: 6px 10px;
    margin-left: 6px;
    background: #fff;
    display: flex;
    align-items: center
}

a.btn-share:hover {
    background: #50aede;
    border-color: #50aede
}

a.btn-share:hover svg path {
    fill: #fff
}

img.icon-copy {
    margin-right: 8px
}

.btn-share img,.btn-share svg {
    width: 25px
}

.btn-div-share {
    float: left;
    display: inline-flex;
    align-content: center
}

.btn-share:last-child {
    margin-left: 0
}

img.icon-copy {
    margin-right: 5px
}

.related-post {
    padding-bottom: 80px
}

.related-post,.single-post-comment {
    padding-top: 40px
}

h4.related-post-title {
    color: #243161
}

.nav-btn {
    float: left
}

a.related-next svg,a.related-prev svg {
    width: 30px
}

a.related-next,a.related-prev {
    text-decoration: none
}

a.related-next svg path,a.related-prev svg path {
    fill: #d8d8d8
}

a.related-next:hover svg path,a.related-prev:hover svg path {
    fill: #292d32
}

.single-post img.post-blog-thumbnail {
    height: 238px;
    object-fit: cover
}

.div-author img.avatar.avatar-96.photo {
    width: 55px;
    height: 55px;
    border-radius: 55px;
    margin-left: 15px
}

p.audio-description {
    color: #667085;
    font-size: 19px;
    margin-top: 15px
}

hr.hr-audio-post {
    color: #667085;
    margin-top: 40px;
    margin-bottom: 40px
}

.comment-card {
    background: #f7f8f9;
    margin-bottom: 20px;
    position: relative;
    border-radius: 10px;
    padding: 10px
}

h6.comment-time {
    color: #64748b;
    font-weight: 400;
    font-size: 14px;
    margin-bottom: 5px
}

p.comment-para {
    font-size: 16px;
    color: #191d23;
    margin-bottom: 7px
}

.comment-react {
    display: inline-flex;
    color: #64748b;
    font-weight: 600;
    font-size: 13px
}

button.comment-more {
    border: none;
    background: transparent;
    position: absolute;
    left: 10px;
    top: 2px
}

button.comment-more img {
    width: 25px
}

img.comment-user-avatar {
    position: absolute;
    width: 25px;
    border-radius: 50px;
    top: 0;
    right: -29px
}

.comment-container {
    margin-top: 40px;
    position: relative
}

.comment-react img {
    padding-left: 2px;
    margin-top: -3px
}

.comment-reply {
    margin-left: 27px
}

.comment-container:before {
    position: absolute;
    content: "";
    width: 1px;
    height: 100%;
    background: #d0d5dd;
    right: -17px
}

input.comment {
    color: #64748b;
    width: 89%;
    border-radius: 5px;
    border: 1px solid #d0d5dd;
    height: 100%;
    line-height: 35px;
    padding: 2px 10px
}

button.comment-btn {
    width: 10%;
    padding-bottom: 10px;
    padding-top: 5px;
    background: #23397e;
    color: #fff;
    border: none;
    border-radius: 5px;
    margin-right: 1%
}

button.comment-btn:hover {
    background: #50aede
}

form.comment-input-div {
    display: flex;
    align-items: center
}

.comment-likes,.comment-reply {
    cursor: pointer
}

.is-reply {
    margin-right: 30px
}

.header.page-blog.fixed img.main-logo {
    display: none
}

section.header.page-blog a.nav-link.btn-login-1 {
    color: #fff
}

img.footer-logo {
    margin-bottom: 15px;
    width: 140px
}

.capital-market {
    width: 60%;
    margin-bottom: 12px
}

footer .footer-email a {
    margin-bottom: 0;
    margin-top: 10px;
    font-size: 20px
}

footer ul.social-icons li img {
    width: 30px
}

.footer-email,ul.social-icons {
    width: 100%;
    text-align: end
}

footer.footer {
    padding-top: 40px;
    padding-bottom: 35px
}

p.footer-para {
    font-size: 14px
}

footer ul.social-icons li {
    padding: 0 4px
}

footer.footer .row {
    align-items: flex-end
}

h4.real-estate {
    color: #08567e
}

h4.invoices {
    color: #770f07
}

h4.stocks {
    color: #002131
}

h4.gold {
    color: #6a5605
}

.percent {
    position: relative;
    z-index: 9999;
    display: flow-root;
    width: 70%;
    text-align: center;
    margin: 0 auto;
    top: -85px
}

.percent h4 {
    display: inline-table;
    width: calc(100% / 4.3);
    font-weight: 600
}

.faq-category-div {
    margin-bottom: 13px
}

.faq-cat-btn {
    background: #50aede;
    border: none;
    width: 100%;
    padding: 10px;
    font-size: 20px;
    color: #fff;
    font-weight: 500
}

img.cat-icon {
    -webkit-margin-start: 5px;
    margin-inline-start:5px;width: 25px;
    top: -3px;
    position: relative
}

button.faq-cat-btn.active {
    background: #243161
}

.faq-category-div .row>* {
    padding-left: 0
}

.faq-grid {
    display: grid;
    grid-gap: 1rem;
    gap: 1rem;
    grid-template-columns: 1fr
}

.participent-card {
    background: #f9f9f9;
    padding: 40px;
    border-radius: 10px;
    text-align: center
}

select#slct {
    background: transparent!important
}

.participent-card span {
    display: block
}

span.part-card-percent {
    color: #50aede;
    font-size: 25px;
    font-weight: 600;
    margin: 15px 0
}

span.part-card-bar {
    background: #d1564d;
    height: 7px;
    width: 50px;
    margin: 0 auto
}

h4.participent-title {
    font-size: 30px;
    text-align: center;
    color: #243161;
    display: flex;
    align-items: center;
    height: 100%
}

span.part-card-text {
    font-size: 19px;
    color: #243161;
    font-weight: 400
}

.p-c-1 span.part-card-bar {
    background: #f3d961
}

section.new_participent {
    margin-bottom: 60px
}

.participent-card {
    background: #fff
}

.partiscipients {
    margin: 90px 0
}

.chart-config .s-hidden {
    visibility: hidden;
    padding-right: 10px
}

.chart-config .select {
    cursor: pointer;
    display: block;
    position: relative;
    margin-top: 20px
}

.chart-config .styledSelect {
    position: absolute;
    background: #0b1744;
    color: #fff;
    border: none;
    border-radius: 10px;
    margin-bottom: 25px;
    font-weight: 500;
    background-image: url(/wp-content/themes/theforest/images/arrow-down.svg);
    background-repeat: no-repeat;
    background-position: left .75rem center;
    background-size: 26px 22px;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    height: 50px;
    line-height: 45px;
    -webkit-padding-start: 20px;
    padding-inline-start:20px}

.chart-config .styledSelect[data-lang=en] {
    background-position: right .75rem center
}

.chart-config .options {
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    left: 0;
    z-index: 99999;
    padding: 0;
    list-style: none;
    background-color: #0b1744;
    border-radius: 10px;
    box-shadow: 0 1px 2px rgba(0,0,0,.2);
    margin: 5px 0 0
}

.chart-config .options li {
    margin: 0;
    padding: 7px 20px 12px!important;
    border-radius: 10px;
    display: block!important;
    width: 100%!important;
    color: #fff!important
}

.chart-config .options li:hover {
    background-color: #50aede;
    color: #fff
}

span.address-footer {
    color: #50aede;
    display: block;
    margin-top: 6px
}

.slct-record {
    cursor: pointer
}

.apps-icons {
    margin: .75rem 0;
    display: flex;
    gap: .2rem;
    justify-content: flex-end;
    width: 100%
}

.apps-icons img {
    width: 100px
}

.cls-256 {
    fill: #0b0b0b
}

.cls-255 {
    fill: #444
}

.cls-257 {
    -webkit-mask: url(#mask-17);
    mask: url(#mask-17)
}

.cls-195 {
    -webkit-clip-path: url(#clip-path-190);
    clip-path: url(#clip-path-190)
}

.cls-258 {
    -webkit-clip-path: url(#clip-path-223);
    clip-path: url(#clip-path-223)
}

.cls-259 {
    -webkit-mask: url(#mask-18);
    mask: url(#mask-18)
}

.cls-70 {
    fill: #fff
}

.cls-6 {
    -webkit-clip-path: url(#clip-path-19);
    clip-path: url(#clip-path-19)
}

.cls-3 {
    isolation: isolate
}

.cls-4 {
    -webkit-clip-path: url(#clip-path-9);
    clip-path: url(#clip-path-9)
}

.cls-5 {
    fill: #d9d9d9
}

.cls-2 {
    fill: none
}

.st0 {
    fill: #243161
}

.st1 {
    opacity: .4
}

.st2 {
    fill: url(#SVGID_1_)
}

.st3 {
    fill: url(#SVGID_00000060001026633451142690000016479450190665802417_)
}

.st4 {
    fill: url(#SVGID_00000171704504702603462130000007747921872026164120_)
}

.st5 {
    fill: #e1e424
}

.st6 {
    fill: #cc8c10
}

.st7 {
    fill: #ebd936
}

.st8 {
    fill: #f7eb33
}

.st9 {
    fill: url(#SVGID_00000137098349156113097450000003448059453226548155_)
}

.st10 {
    fill: url(#SVGID_00000176036092360783637100000005190183622474014908_)
}

.st11 {
    fill: #ecf0f1
}

.st12 {
    fill: #213778
}

.st13 {
    fill: #0e3ccc
}

.st14 {
    fill: #03299f
}

.st15 {
    fill: #2040a5
}

.st16 {
    fill: #7ccfe8
}

.st17 {
    fill: #84dbff
}

.st18 {
    fill: #77c6d8
}

.st19 {
    fill: #d6d6d6
}

.st20 {
    fill: #c6a51a
}

.st21 {
    fill: #d6b218
}

.st22 {
    fill: #e5bd13
}

.st23 {
    fill: #c6c6c6
}

.st24 {
    fill: #e2e2e2
}

.st25 {
    fill: #3293c9
}

.st26 {
    fill: #3498db
}

.st27 {
    fill: #328eb7
}

.st28 {
    fill: url(#SVGID_00000069395515901202568520000000128918585156529035_)
}

.st29 {
    fill: url(#SVGID_00000048462263581629377950000007593446692569833371_)
}

.st30 {
    fill: #f46864
}

.st31 {
    -webkit-clip-path: url(#SVGID_00000052091157562363882220000004112495145003921056_);
    clip-path: url(#SVGID_00000052091157562363882220000004112495145003921056_)
}

.st32 {
    fill: #d6d4d2
}

.st33 {
    fill: #e9e8e6
}

.st34 {
    fill: #b2b0af
}

.st35 {
    fill: #ddb040
}

.st36 {
    fill: #fff
}

.st37 {
    fill: #ffd651
}

.st38 {
    fill: #f25a5a
}

.st39 {
    fill: #494846
}

.st40 {
    fill: #383736
}

.st41 {
    fill: #21201f
}

.st42 {
    fill: #2d2c2b
}

.st43 {
    fill: #d4d6d6
}

.st44 {
    fill: #cc4848
}

.st45 {
    fill: #c44141
}

.st46 {
    fill: #dd4a4a
}

.st47 {
    fill: #efc348
}

.st48 {
    fill: #cea03a
}

.st49 {
    fill: #ff9c00
}

.st50 {
    fill: #fdc000
}

.st51 {
    fill: url(#SVGID_00000168095960912811438760000007909438780475424671_)
}

.st52 {
    fill: url(#SVGID_00000116946750939854134730000002591035176827840909_)
}

.st53 {
    fill: #ccc
}

.st54 {
    fill: #e4e8f4
}

.st55 {
    fill: #3891bd
}

.st56 {
    fill: #875744
}

.st57 {
    fill: #9e6a4d
}

.st58 {
    fill: #637b8d
}

.st59 {
    fill: #8fb545
}

.st60 {
    fill: #9fc14c
}

.st61 {
    fill: #b2cc5e
}

.st62 {
    fill: #ddccac
}

.st63 {
    fill: #ead9b5
}

.st64 {
    fill: #b7805a
}

.st65 {
    fill: #d49b6e
}

.st66 {
    fill: #f7e4ba
}

.st67 {
    fill: #5f6269
}

.st68 {
    fill: #78c2ff
}

.st69 {
    fill: #c1c1c1
}

.st70 {
    fill: #4c525d
}

.st71 {
    fill: #93624a
}

.st72 {
    fill: #5f656f
}

.st73 {
    fill: #4b82bf
}

.st74 {
    fill: #6195ce
}

.st75 {
    fill: #cc4e4e
}

.st76 {
    fill: #e25656
}

.st77 {
    fill: #f06260
}

.st78 {
    fill: #ebebeb
}

.st79 {
    fill: #dadada
}

.st80 {
    fill: #603f22
}

.st81 {
    fill: #81aa40
}

.st82 {
    fill: #5ba5fe
}

.st83 {
    fill: #69b4ff
}

.st84 {
    fill: #529de8
}

.st85 {
    fill: #88cefc
}

.career-banner {
    background-image: url(/wp-content/themes/theforest/font//careersBanner.8c2d6799.webp);
    background-repeat: no-repeat;
    background-size: cover;
    height: 420px;
    width: 100%;
    position: relative
}

.career-banner .title {
    font-size: 3rem;
    text-align: center;
    font-weight: 700;
    width: 60%
}

.career-banner .career-note {
    text-align: center;
    width: 50%;
    line-height: 1.75
}

.career-layer {
    z-index: 10;
    background-color: rgba(36,49,98,.9);
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.career-label {
    z-index: 20;
    position: relative;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    gap: 1.5rem;
    color: #fff
}

.career-card,.career-label {
    display: flex;
    align-items: center
}

.career-card {
    padding: 2rem;
    margin: 0 2rem;
    justify-content: space-between;
    border-bottom: .5px solid #97a7be
}

.career-card .card-label {
    display: flex;
    flex-direction: column;
    gap: .25rem
}

.card-label .title {
    font-size: 1.5rem;
    font-weight: 700
}

.apply-btn {
    outline: 0;
    border-radius: 2rem;
    padding: 1rem 2rem;
    background-color: #51aede;
    border: 1px solid #51aede;
    color: #fff;
    line-height: 1
}

.center-flex {
    justify-content: center
}

.accordion-button:after {
    -webkit-margin-start: auto!important;
    margin-inline-start:auto!important;margin-right: 0!important
}

.accordion-button.collapsed {
    justify-content: space-between
}

.my-chart-container {
    height: 400px
}

.gray-border {
    border: .5px solid #eaeaea;
    width: 1px;
    height: 28px;
    transform: translate(-250%)
}

.hero-content[dir=ltr] {
    direction: ltr;
    text-align: left
}

#evkiGw8A0SD2898_to {
    animation: evkiGw8A0SD2898_to__to 19.5s linear infinite normal forwards
}

@keyframes evkiGw8A0SD2898_to__to {
    0% {
        transform: translate(1411px,608.5px)
    }

    8.421053% {
        transform: translate(1411px,908.5px)
    }

    9.473684% {
        transform: translate(1411px,958.5px)
    }

    10.526316% {
        transform: translate(1461px,981.5px)
    }

    14.736842% {
        transform: translate(1751px,981.5px)
    }

    15.789474% {
        transform: translate(1791px,1011.5px)
    }

    16.842105% {
        transform: translate(1803px,1081.5px)
    }

    25.263158% {
        transform: translate(1803px,1541.5px)
    }

    26.315789% {
        transform: translate(1783px,1586.5px)
    }

    27.368421% {
        transform: translate(1740px,1607.5px)
    }

    31.578947% {
        transform: translate(1460px,1607.5px)
    }

    32.631579% {
        transform: translate(1427px,1573.5px)
    }

    33.684211% {
        transform: translate(1415px,1516.5px)
    }

    42.105263% {
        transform: translate(1415px,1141.5px)
    }

    43.157895% {
        transform: translate(1385px,1091.5px)
    }

    44.210526% {
        transform: translate(1333px,1073.5px)
    }

    48.421053% {
        transform: translate(1093px,1073.5px)
    }

    49.473684% {
        transform: translate(1043px,1103.5px)
    }

    50.526316% {
        transform: translate(1027px,1141.5px)
    }

    58.947368% {
        transform: translate(1027px,1561.5px)
    }

    60% {
        transform: translate(997px,1591.5px)
    }

    61.052632% {
        transform: translate(941px,1606.5px)
    }

    65.263158% {
        transform: translate(691px,1606.5px)
    }

    66.315789% {
        transform: translate(651px,1576.5px)
    }

    67.368421% {
        transform: translate(636px,1531.5px)
    }

    75.789474% {
        transform: translate(636px,1131.5px)
    }

    76.842105% {
        transform: translate(606px,1091.5px)
    }

    77.894737% {
        transform: translate(559px,1078.5px)
    }

    82.105263% {
        transform: translate(281px,1078.5px)
    }

    83.157895% {
        transform: translate(255px,1111.5px)
    }

    84.210526% {
        transform: translate(246px,1147.5px)
    }

    92.631579% {
        transform: translate(246px,1547.5px)
    }

    93.684211% {
        transform: translate(216px,1592.5px)
    }

    94.736842% {
        transform: translate(175px,1612.5px)
    }

    to {
        transform: translate(-25px,1612.5px)
    }
}

#evkiGw8A0SD3050 {
    animation: evkiGw8A0SD3050_c_o 19.5s linear infinite normal forwards
}

@keyframes evkiGw8A0SD3050_c_o {
    0% {
        opacity: 1
    }

    26.315789% {
        opacity: 1
    }

    28.421053% {
        opacity: 0
    }

    to {
        opacity: 0
    }
}

#evkiGw8A0SD3385 {
    animation: evkiGw8A0SD3385_c_o 19.5s linear infinite normal forwards
}

@keyframes evkiGw8A0SD3385_c_o {
    0% {
        opacity: 1
    }

    42.105263% {
        opacity: 1
    }

    44.210526% {
        opacity: 0
    }

    to {
        opacity: 0
    }
}

#evkiGw8A0SD3673 {
    animation: evkiGw8A0SD3673_c_o 19.5s linear infinite normal forwards
}

@keyframes evkiGw8A0SD3673_c_o {
    0% {
        opacity: 1
    }

    60% {
        opacity: 1
    }

    62.105263% {
        opacity: 0
    }

    to {
        opacity: 0
    }
}

#evkiGw8A0SD3802 {
    animation: evkiGw8A0SD3802_c_o 19.5s linear infinite normal forwards
}

@keyframes evkiGw8A0SD3802_c_o {
    0% {
        opacity: 1
    }

    76.842105% {
        opacity: 1
    }

    78.947368% {
        opacity: 0
    }

    to {
        opacity: 0
    }
}

.justify-number[dir=ltr] {
    display: flex;
    width: 100%;
    justify-content: flex-end
}

.display-none {
    display: none!important
}

.display-block {
    display: block!important
}

.toggle-lang-container {
    -webkit-padding-start: 0;
    padding-inline-start:0;-webkit-margin-start: 1rem;
    margin-inline-start:1rem}

.toggle-lang-container.white {
    -webkit-border-start: 1px solid #fff;
    border-inline-start:1px solid #fff}

.toggle-lang-container.dark {
    -webkit-border-start: 1px solid #243161;
    border-inline-start:1px solid #243161}

.latest-posts {
    background: #f9f9f9;
    padding: 30px;
    border-radius: 10px
}

.second-special-post {
    height: 100px;
    padding-bottom: 15px
}

.latestp-title {
    margin-bottom: 2rem
}

.font-size-125 {
    font-size: 1.25rem!important
}

#blog,.blogs-wrapper {
    display: flex;
    justify-content: center;
    z-index: 3
}

#blog {
    margin: 1rem 0;
    max-width: 700px;
    flex-direction: column;
    align-items: flex-start;
    padding: 1rem
}

.blog-z-index {
    position: relative;
    z-index: 2
}

.blog-container {
    width: 700px;
    padding: 0 1rem
}

#blog h1 {
    margin-bottom: 1.5rem
}

#blog h3,#blog h4 {
    margin-bottom: 1rem
}

#blog h5 {
    margin-bottom: .75rem
}

#blog li p {
    margin-bottom: 1.25rem!important
}

#blog li,#blog p {
    color: #8088a4
}

#blog p {
    margin-bottom: 1.75rem
}

#blog img {
    width: auto;
    max-width: 700px
}

@media screen and (max-width: 768px) {
    #blog img {
        max-width:350px
    }
}

.blog-back {
    margin: 2rem 10% .5rem;
    display: flex;
    justify-content: flex-end
}

.blog-back-flex {
    display: flex;
    gap: .25rem;
    cursor: pointer
}

.blog-back-flex div {
    margin-top: -3px
}

.back-btn {
    width: 28px
}

.blog-navbar {
    display: flex!important;
    flex-direction: row;
    justify-content: space-between;
    width: 100%;
    align-items: center
}

.bold-link {
    cursor: pointer;
    margin: 0 2px;
    font-weight: 500;
    text-decoration: none
}

.bold-link,.bold-link :hover {
    color: #243161
}

.col-md-full {
    flex: 0 0 auto;
    width: 100%
}

.single-blog-img {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 2rem 0;
    padding: 0 1rem
}

.single-blog-img img {
    border-radius: .5rem;
    max-width: 700px;
    z-index: 2;
    width: 100%;
    height: auto;
    object-fit: cover;
    position: relative
}

.main-blog-container {
    padding-top: 3rem;
    background: #fafafa
}

.pe-075 {
    -webkit-padding-end: .75rem;
    padding-inline-end:.75rem}

.mb-8 {
    margin-bottom: 2rem
}

.cursor-pointer {
    cursor: pointer
}

.text-gray-600 {
    color: var(--gray-600)
}

.text-blue-400 {
    color: var(--blue-400)
}

.text-blue-800 {
    color: var(--blue-800)
}

.text-blue-700 {
    color: var(--blue-700)
}

@media (max-width: 1366px) and (min-width:0px) {
    .shariyah-btn {
        font-size:13px;
        padding-bottom: 10px;
        padding-top: 5px
    }

    img.wallet-coin {
        width: 70%
    }

    .why-invest-card img {
        width: 80px!important
    }

    section.home-hero .content {
        padding-left: 20px;
        padding-right: 20px
    }

    section.about:before {
        width: 70%;
        background-size: 100%;
        bottom: -70px;
        left: -85px
    }

    p.about-p {
        line-height: 28px
    }

    img.about-s-img {
        margin-top: -40px;
        width: 297px
    }

    section.about.pt-150.pb-200 {
        padding-top: 90px;
        padding-bottom: 130px
    }

    img.about-img {
        width: 99%;
        margin: 0 auto;
        z-index: 9;
        position: relative
    }

    .about-img-div {
        text-align: center
    }

    h1.home-hero-title {
        font-size: 27px
    }

    p.home-hero-p {
        font-size: 15px;
        margin-bottom: 35px
    }

    section.home-hero:before {
        height: 100%
    }

    section.home-hero:after {
        height: 80px
    }

    .main-navbar {
        padding-top: 19px
    }

    .tree-hero {
        height: 74vh
    }

    ul.navbar-nav.left-nav li a.btn-login {
        padding: 7px 25px 10px!important
    }

    ul.navbar-nav.left-nav li a {
        padding: 0 14px 0 0!important;
        font-size: 15px
    }

    section.about-video:after,section.about:after {
        background-size: 100%;
        bottom: -30px
    }

    h4.cta-title {
        font-size: 26px
    }

    section.calculator:after,section.contact:after {
        background-size: 100%;
        bottom: -30px
    }

    a.nav-link.active:before {
        bottom: -15px;
        width: 5px;
        height: 5px;
        right: 14px
    }

    .video-thumbnail {
        width: 50%
    }

    section.about-video {
        padding-bottom: 100px;
        padding-top: 50px
    }

    section.wallet-type .container {
        max-width: 1040px
    }

    h4.wallet-card-title {
        margin-top: -5px
    }

    img.wallet-icon {
        max-width: 120px
    }

    p.wallet-card-para {
        margin-bottom: 14px
    }

    h4.wallet-card-title {
        font-weight: 700;
        font-size: 23px;
        margin-top: 13px
    }

    section.why-invest {
        background-size: 100%
    }

    img.security-img {
        width: 76%
    }

    h1.security-title {
        font-size: 27px
    }

    section.security {
        padding-bottom: 45px
    }

    section.calculator {
        padding-bottom: 50px
    }

    p.about-p {
        font-size: 14px;
        line-height: 25px
    }

    h2.about-title {
        font-size: 37px
    }

    section.about .about-s-img {
        width: 70%;
        display: inline-flex
    }

    section.about .about-s-img img {
        width: 100%
    }

    section.about .about-s-img img.Stamp {
        width: 90%
    }

    h1#start--t,h1.security-title {
        line-height: 40px
    }

    h1#start--t {
        font-size: 27px
    }

    p.invest-para,p.security-para {
        font-size: 16px
    }

    h1.invest-title {
        font-size: 27px;
        line-height: 40px
    }

    p.why-invest-para {
        font-size: 16px;
        font-weight: 400
    }

    img.footer-logo {
        width: 150px
    }

    p.footer-para {
        font-size: 16px
    }

    footer .footer-email a {
        font-size: 19px
    }

    .chart-config h3,h1.team-title {
        font-size: 35px
    }

    .team-active {
        z-index: 9999
    }

    .team-active:after {
        bottom: -220px
    }

    p.t-quote {
        min-height: 180px
    }

    section.about .about-s-img {
        width: 55%
    }

    section.about:after {
        height: 70px;
        bottom: -2px
    }

    section.about-video:after {
        height: 70px;
        bottom: -1px
    }

    .header.fixed img.main-logo {
        width: 100px
    }

    section.contact:after {
        height: 70px
    }

    .why-invest-card {
        width: 80%
    }

    .why-invest-card img {
        width: 60px!important
    }

    h4.why-invest-title {
        font-size: 21px;
        margin-bottom: 15px
    }

    p.why-invest-para {
        font-size: 14px;
        line-height: 25px
    }

    img.footer-logo {
        width: 120px;
        margin-bottom: 30px
    }

    p.footer-para {
        font-size: 14px
    }

    footer .footer-email a {
        font-size: 14px;
        margin-bottom: 30px;
        text-align: end
    }

    .footer-email {
        width: 100%;
        text-align: left
    }

    footer ul.social-icons li svg {
        width: 30px;
        height: 30px
    }

    .capital-market {
        width: 60%
    }

    footer.footer {
        padding: 60px 0
    }

    section.about:before {
        bottom: -120px
    }

    canvas#about-img {
        left: 23px
    }

    section.about {
        margin-bottom: -5px
    }

    section.about:after {
        bottom: 5px
    }

    section.contact:after {
        top: -1px
    }

    canvas#withdrawal {
        top: -40px
    }

    img.video-play {
        width: 60px;
        top: calc(50% + 20px)
    }

    a#play-video:before {
        top: calc(50% + 20px);
        width: 50px;
        height: 50px
    }

    canvas#about-img {
        left: -4px
    }

    canvas#withdrawal {
        top: 13%;
        width: 50%
    }

    h1.iw-title {
        font-size: 21px
    }

    p.iw-para {
        font-size: 13px
    }

    section.investment-wallets {
        padding-top: 50px
    }

    h1.iw-wallet-title {
        font-size: 16px;
        margin-bottom: 5px
    }

    p.iw-wallet-para {
        font-size: 11px
    }

    .wallets-chart {
        margin-top: 0;
        width: 50%
    }

    section.investment-wallets:before {
        height: 230px!important
    }

    section.investment-wallets .container {
        max-width: 950px
    }

    h1.iw-title:before {
        top: -20px;
        right: -35px
    }

    .navbar-expand-lg .navbar-nav .nav-link {
        font-size: 13px;
        font-weight: 700;
        text-align: start
    }

    img.main-logo {
        width: 120px
    }

    ul.navbar-nav.left-nav li a.btn-login {
        min-width: 130px
    }

    img.h-icon-user {
        width: 25px;
        height: 25px
    }

    .how-to-start:before {
        right: 1px
    }

    h1.home-hero-title {
        font-size: 55px
    }

    p.home-hero-p {
        line-height: 30px
    }

    a.btn-know-more,a.main-btn,p.home-hero-p {
        font-size: 13px
    }

    section.about.pt-150.pb-200 {
        padding-top: 0
    }

    h2.about-title {
        font-size: 30px
    }

    p.about-p {
        font-size: 12px
    }

    h1.about-v-title,h1.wallet-title {
        font-size: 30px
    }

    img.about-v-t-icon {
        width: 25px
    }

    h4.wallet-title-s {
        font-size: 20px
    }

    p.wallet-para {
        font-size: 13px;
        line-height: 25px
    }

    h4.wallet-card-title {
        font-size: 20px
    }

    p.wallet-card-para {
        font-size: 13px
    }

    h4.cta-title {
        font-size: 20px
    }

    p.cta-para {
        font-size: 13px;
        line-height: 25px;
        padding: 0 10px
    }

    section.cta:before {
        top: 46%
    }

    section.cta {
        padding: 70px 0
    }

    h1.why-invest-main-title {
        font-size: 30px
    }

    h4.why-invest-title {
        font-size: 20px
    }

    p.why-invest-para {
        font-size: 13px
    }

    section.invest {
        padding: 80px 0
    }

    section.invest .container,section.security .container {
        max-width: 930px
    }

    h1.invest-title,h1.security-title {
        font-size: 23px;
        line-height: 33px
    }

    p.invest-para,p.security-para {
        font-size: 14px;
        line-height: 24px
    }

    section.calculator {
        padding-top: 80px
    }

    .chart-config h3 {
        font-size: 25px;
        margin-bottom: 15px
    }

    h4.chart-calc {
        margin-bottom: 15px;
        font-size: 18px
    }

    h4.chart-calc i {
        width: 25px;
        height: 25px;
        font-size: 15px;
        line-height: 25px
    }

    .nav-pills .nav-link {
        font-size: 12px
    }

    .chart-config p {
        font-size: 16px;
        margin-bottom: 30px
    }

    .chart-config h4 {
        font-size: 14px
    }

    .rang-sliders label {
        font-size: 13px
    }

    .chart-config ul li a {
        font-size: 13px;
        padding-bottom: 10px;
        padding-top: 8px
    }

    label.numbers_ranged {
        width: 32%
    }

    label.blacked_ranged.bld_r {
        font-size: 12px;
        padding-top: 3px
    }

    p.cls-para {
        font-size: 13px
    }

    h4.cls-nbr {
        font-size: 16px;
        margin-bottom: 15px
    }

    div#highcharts-m5k0654-0 {
        height: 360px!important
    }

    .rang-sliders {
        margin-bottom: 0
    }

    p.t-quote {
        font-size: 11px;
        line-height: 25px
    }

    h4.t-name {
        font-size: 20px
    }

    p.t-role {
        font-size: 16px
    }

    h1.team-title {
        font-size: 25px
    }

    .team-active {
        width: 80%;
        margin: 0 auto
    }

    .team-active:after {
        bottom: -170px
    }

    h1.faq-main-title {
        font-size: 30px
    }

    img.icon-faq {
        width: 60px
    }

    div#accordionExample button.accordion-button.collapsed {
        font-size: 13px
    }

    .accordion-item {
        min-height: 60px;
        font-size: 11px!important
    }

    .accordion-body {
        font-size: 12px
    }

    .faq button[aria-expanded=true] {
        font-size: 13px
    }

    section#faq {
        margin-top: -50px;
        padding-bottom: 70px!important
    }

    section.contact {
        padding: 50px 0
    }

    h1.contact-main-title {
        font-size: 30px;
        margin-bottom: 10px
    }

    p.contact-main-p {
        font-size: 14px
    }

    form.contact-f input.form-control {
        height: 35px;
        font-size: 11px
    }

    #contact-form textarea {
        font-size: 11px
    }

    form.contact-f .main-btn.btn-blue {
        font-size: 13px;
        padding: 6px 6px 9px
    }

    canvas#about-img {
        left: 20px
    }

    canvas#about-img[data-lang=en] {
        left: 30px
    }

    h4.chart-calc i:after {
        background: #43608d
    }

    section.invest:before {
        min-height: 460px
    }

    section#shariyah {
        padding-top: 0;
        padding-bottom: 60px
    }

    section.calculator {
        padding-top: 130px
    }

    img#shariyah-img {
        width: 75%;
        float: left
    }

    img.shariyah-logo {
        width: 35px
    }

    section.blog-hero {
        height: 30vh
    }

    img.blog-hero-img {
        max-width: 30%
    }

    h1.blog-hero-title {
        font-size: 35px;
        margin-bottom: 12px
    }

    p.blog-hero-p {
        font-size: 13px;
        margin-bottom: 30px
    }

    input.search {
        line-height: 35px;
        font-size: 13px
    }

    .search-div {
        padding: 3px 10px
    }

    button.search-btn {
        padding: 7px;
        font-size: 13px
    }

    img.search-icon {
        width: 17px
    }

    body.blog {
        overflow-x: hidden
    }

    .second-special-post h6.post-date {
        font-size: 13px
    }

    .second-special-post img.clock-s-icon {
        width: 15px!important
    }

    .second-special-post h4.minute-text {
        font-size: 12px
    }

    img.audio-s-icon {
        width: 15px!important
    }

    h4.post-title a {
        font-size: 14px
    }

    .second-special-post p.post-content {
        line-height: 21px
    }

    h6.post-date {
        font-size: 13px
    }

    h4.minute-text {
        font-size: 12px
    }

    img.clock-s-icon {
        width: 16px!important
    }

    span.min-audio-card {
        padding: 4px 8px
    }

    p.post-content {
        font-size: 12px;
        line-height: 21px
    }

    section.single-hero {
        height: 65vh
    }

    section.single-hero:after,section.single-hero:before {
        width: 130px;
        bottom: 20px
    }

    section.single-hero ol.breadcrumb li {
        font-size: 13px
    }

    h4.single-post-title {
        font-size: 23px;
        line-height: 35px;
        margin-bottom: 15px
    }

    section.single-hero ol.breadcrumb {
        margin-bottom: 8px
    }

    h6.post-single-date {
        font-size: 15px
    }

    .single-post-div {
        margin-top: -80px
    }

    section.single-hero .post-tags .post-tag {
        font-size: 13px
    }

    h4.post-title,p.audio-description {
        font-size: 17px;
        line-height: 25px
    }

    h6.author-name {
        font-size: 16px
    }

    p.author-info {
        font-size: 15px;
        padding-top: 5px
    }

    .div-author img.avatar.avatar-96.photo {
        width: 50px;
        height: 50px
    }

    .btn-share {
        font-size: 13px;
        padding: 5px 8px
    }

    .btn-share img,.btn-share svg {
        width: 18px
    }

    h4.related-post-title {
        font-size: 21px
    }

    a.related-next svg,a.related-prev svg {
        width: 25px
    }
}

@media screen and (height: 657px) {
    svg.page-hero {
        top:21.7%
    }
}

@media screen and (height: 625px) {
    svg.page-hero {
        top:18.2%
    }
}

@media (max-width: 1440px) and (height:757px) {
    svg.page-hero {
        top:28.5%
    }
}

@media (max-width: 1440px) and (height:789px) {
    svg.page-hero {
        top:31.4%
    }
}

@media (max-width: 1600px) and (height:757px) {
    svg.page-hero {
        top:16%
    }

    .hide-mobile.blank-step {
        height: 215px
    }
}

@media (max-width: 1600px) and (height:789px) {
    svg.page-hero {
        top:19.4%
    }

    .hide-mobile.blank-step {
        height: 215px
    }
}

@media (max-width: 1600px) and (height:881px) {
    svg.page-hero {
        top:27.6%
    }

    .hide-mobile.blank-step {
        height: 215px
    }
}

@media (max-width: 1600px) and (height:913px) {
    svg.page-hero {
        top:30.4%
    }

    .hide-mobile.blank-step {
        height: 215px
    }
}

@media (max-width: 1680px) and (height:907px) {
    svg.page-hero {
        top:26.2%
    }

    .hide-mobile.blank-step {
        height: 235px
    }
}

@media (max-width: 1680px) and (height:939px) {
    svg.page-hero {
        top:28.8%
    }

    .hide-mobile.blank-step {
        height: 235px
    }
}

@media (max-width: 1768px) and (height:849px) {
    svg.page-hero {
        top:17%
    }

    .hide-mobile.blank-step {
        height: 265px
    }
}

@media (max-width: 1768px) and (height:881px) {
    svg.page-hero {
        top:20%
    }

    .hide-mobile.blank-step {
        height: 265px
    }
}

@media (max-width: 1280px) and (height:577px) {
    .hide-mobile.blank-step {
        height:110px
    }
}

@media (max-width: 1280px) and (height:609px) {
    svg.page-hero {
        top:21%
    }

    .hide-mobile.blank-step {
        height: 110px
    }
}

@media (max-width: 1280px) and (height:625px) {
    svg.page-hero {
        top:23.2%
    }

    .hide-mobile.blank-step {
        height: 110px
    }
}

@media (max-width: 1280px) and (height:657px) {
    svg.page-hero {
        top:26.8%
    }

    .hide-mobile.blank-step {
        height: 110px
    }

    svg.page-hero {
        top: 23.2%
    }

    .hide-mobile.blank-step {
        height: 110px
    }
}

@media (max-width: 1280px) and (height:689px) {
    svg.page-hero {
        top:30.3%
    }

    .hide-mobile.blank-step {
        height: 110px
    }
}

@media (max-width: 1280px) and (min-width:1366px) {
    section.about-video:after,section.about:after {
        bottom:-1%
    }

    section.contact:after {
        top: -1%
    }
}

@media (min-width: 768px) and (max-width:820px) and (min-height:1024px) and (max-height:1180px) {
    section.home-hero {
        height:100vh
    }

    .tree-hero {
        height: 49vh;
        right: -60px
    }

    h1.home-hero-title {
        font-size: 48px
    }

    p.home-hero-p {
        font-size: 14px;
        color: #fff
    }

    div#navbarNavDropdown.navbar-collapse.collapse.navbar-collapse.show {
        display: block!important;
        background-color: #fff;
        padding: 0 .5rem
    }

    section.header {
        z-index: 1000000000000000000
    }

    .header.fixed img.main-logo {
        width: 150px!important
    }

    button.navbar-toggler svg {
        width: 30px;
        margin-left: 15px
    }

    div#navbarNavDropdown.collapse.navbar-collapse.show {
        display: block!important
    }

    ul.navbar-nav.left-nav {
        background: #fff;
        width: 100%;
        padding-bottom: 44px;
        padding-top: 23px;
        height: 100vh;
        margin-top: 20px
    }

    section.header {
        width: 100%!important;
        left: 0;
        right: 0;
        position: absolute
    }

    .li-icon-user {
        display: none
    }

    ul.navbar-nav.left-nav li a {
        padding: 15px!important
    }

    a.nav-link.active:before {
        display: none
    }

    ul.navbar-nav.left-nav li a.btn-login {
        padding: 15px 51px!important;
        margin-top: 22px;
        text-align: center
    }

    ul.navbar-nav.left-nav li {
        border-bottom: 1px solid #00000021;
        width: 89%;
        text-align: right
    }

    ul.navbar-nav.left-nav li:last-child {
        border: 0
    }

    .collapse.navbar-collapse:not(.show) {
        display: none!important
    }

    section.header.mobile-nav nav.navbar.navbar-expand-lg.main-navbar {
        background: #fff;
        left: 0;
        right: 0;
        width: 100%
    }

    .header.fixed {
        height: 110px!important
    }

    ul.navbar-nav.left-nav {
        margin-top: 0
    }

    section.header .container {
        position: static;
        max-width: none;
        width: 100%;
        margin: 0;
        padding: 0
    }

    .main-navbar {
        width: 100%!important
    }

    a.navbar-brand img,img.fix-logo {
        margin-right: 30px!important
    }

    .how-to-start:before {
        display: none
    }

    section.home-hero:after {
        bottom: -2px
    }

    section.home-hero:before {
        background-position: 50%;
        bottom: -2px;
        height: 230px
    }

    div#video-overlay iframe {
        width: 90%!important;
        height: 400px
    }

    section.about {
        padding-top: 70px!important;
        padding-bottom: 100px!important;
        background: #192551
    }

    section.about:after {
        bottom: 0;
        height: 45px
    }

    section.about .row {
        display: block
    }

    section.about .row .col-md-6 {
        width: 100%;
        text-align: center
    }

    p.about-p {
        text-align: center;
        padding: 0
    }

    p.about-p.p-last {
        margin-bottom: 50px!important
    }

    canvas#about-img {
        width: 75%;
        z-index: 99
    }

    img.about-arrow-mobile {
        position: absolute;
        bottom: 4px;
        z-index: 9
    }

    .about-arrow-mobile-bottom.hide-desktop {
        display: block;
        background: #fff!important
    }

    section.about .about-s-img {
        z-index: 99
    }

    section.about-video:after {
        bottom: 0;
        height: 40px
    }

    .video-thumbnail {
        width: 65%
    }

    img.about-v-t-icon {
        width: 35px
    }

    .wallet-card {
        padding: 0 5px
    }

    section.cta,section.invest {
        padding: 100px 0
    }

    section.calculator:after {
        bottom: auto;
        top: -2px
    }

    section.calculator {
        padding-top: 150px
    }

    section.calculator .col-md-4,section.calculator .col-md-8 {
        width: 100%
    }

    .rang-sliders {
        margin-bottom: 50px
    }

    section.team {
        margin-top: -2px;
        padding-bottom: 300px
    }

    div#teamcarousel,p.t-quote {
        text-align: center
    }

    section.team:after {
        bottom: -2px
    }

    section.security {
        padding-bottom: 100px
    }

    .cta-content {
        width: 65%
    }

    section.team .carousel-item img {
        width: 75%!important
    }

    section.contact:after {
        height: 40px
    }

    p.footer-para {
        font-size: 11px
    }

    footer.footer .capital-market {
        width: 75%
    }

    h1.invest-title,h1.security-title {
        font-size: 21px
    }

    .team-active:after {
        display: none
    }

    section.team .carousel-item img {
        width: 90%!important
    }

    div#teamcarousel img.team-active-img {
        z-index: 1
    }

    img.mobile-team-slider-btn {
        width: 50px!important;
        position: absolute;
        top: 520px;
        left: 5%;
        cursor: pointer;
        z-index: 999!important
    }

    .security-content {
        padding-right: 20px
    }

    .invest-content {
        padding-left: 20px
    }

    section.invest .container,section.security .container {
        padding: 0 70px
    }
}

@media (device-width: 820px) and (device-height:1180px) and (orientation:portrait) {
    .tree-hero {
        right:-10%
    }
}

@media (min-width: 768px) and (max-width:820px) and (min-height:1024px) and (max-height:1180px) {
    section#fruits-of-investment {
        padding-bottom:70px
    }

    .foi-card {
        min-height: 300px!important
    }

    p.foi-para {
        font-size: 11px
    }

    img.foi-img {
        width: 55px
    }

    body.page section.header.page-2.mobile-nav ul.navbar-nav.left-nav li a {
        color: #192551
    }

    .header.page-2.mobile-nav img.fix-logo {
        width: 150px;
        margin: 0
    }
}

@media (max-width: 992px) and (min-width:0px) {
    div#navbarNavDropdown.navbar-collapse.collapse.navbar-collapse.show {
        display:block!important;
        background-color: #fff
    }

    button.navbar-toggler svg {
        width: 30px;
        margin-left: 15px
    }

    div#navbarNavDropdown.collapse.navbar-collapse.show {
        display: block!important
    }

    ul.navbar-nav.left-nav {
        background: #fff;
        width: 100%;
        padding-bottom: 44px;
        padding-top: 23px;
        height: 100vh;
        margin-top: 20px
    }

    section.header {
        z-index: 1000000000000000000
    }

    .li-icon-user {
        display: none
    }

    ul.navbar-nav.left-nav li a,ul.navbar-nav.left-nav li div {
        padding: 15px!important
    }

    a.nav-link.active:before {
        display: none
    }

    ul.navbar-nav.left-nav li a.btn-login {
        padding: 15px 51px!important;
        margin-top: 22px;
        text-align: center
    }

    ul.navbar-nav.left-nav li {
        border-bottom: 1px solid #00000021;
        width: 89%;
        text-align: right
    }

    ul.navbar-nav.left-nav li:last-child {
        border: 0
    }

    body,html {
        overflow-x: hidden
    }

    .tree-hero {
        height: 303px!important;
        right: 0;
        left: 0!important;
        margin: 0 auto
    }

    section.home-hero .content {
        padding-bottom: 0
    }

    section.home-hero:after {
        height: 40px
    }

    section.home-hero:before {
        height: 100%
    }

    img.main-logo {
        width: 110px!important;
        margin-right: 20px
    }

    a.main-btn {
        padding: 7px 25px 10px!important
    }

    h2.about-title {
        font-size: 40px;
        margin-right: 20px
    }

    section.about {
        padding-top: 30px
    }

    p.about-p {
        padding: 15px
    }

    .why-invest-card {
        margin-bottom: 75px
    }

    .invest-content {
        padding: 13px
    }

    h1.invest-title {
        font-size: 31px
    }

    section.invest {
        padding-top: 10px
    }

    img.invest-img {
        margin-top: 35px;
        width: 90%;
        padding-right: 8%
    }

    h1.security-title {
        font-size: 21px;
        line-height: 40px
    }

    .security-content {
        padding-right: 15px;
        padding-left: 15px;
        margin-top: 35px
    }

    img.security-img {
        width: 70%;
        margin: 0 auto
    }

    .vcenter-item,img.security-img {
        text-align: center
    }

    .contact .offset-2 {
        margin-right: 0;
        padding: 0 30px
    }

    footer.footer:after {
        z-index: 0
    }

    footer.footer .container {
        z-index: 10000;
        position: relative
    }

    p.footer-para {
        margin-bottom: 50px;
        line-height: 39px
    }

    ul.social-icons {
        width: 100%;
        padding: 0;
        text-align: revert;
        overflow: hidden
    }

    footer .footer-email a {
        width: 100%;
        text-align: right;
        display: block
    }

    .footer-email {
        width: 100%;
        float: none;
        padding-top: 28px!important
    }

    .capital-market {
        display: inline-flex;
        width: 85%;
        text-align: center!important;
        right: 0;
        position: relative;
        float: revert
    }

    img.capital-market-img {
        margin: 0 auto!important;
        position: static!important;
        left: auto!important;
        float: none
    }

    .cta-content {
        width: 100%
    }

    h4.cta-title {
        line-height: 35px;
        font-size: 22px
    }

    p.cta-para {
        padding: 0
    }

    img.wallet-coin {
        margin-top: 60px
    }

    section.wallet-type .main-title {
        width: 100%;
        padding: 10px
    }

    img.about-v-t-icon {
        margin-top: 25px
    }

    section.cta.pt-150.pb-150 {
        padding-top: 90px
    }

    section.contact {
        padding-bottom: 50px
    }

    footer {
        padding-top: 50px!important
    }

    img.about-s-img {
        margin-bottom: 168px;
        max-width: 100%;
        margin-top: -30px
    }

    p.about-p {
        padding-bottom: 0
    }

    section.about:after {
        bottom: 0!important;
        height: 21px
    }

    section.about.pt-150.pb-200 {
        padding-bottom: 90px
    }

    section.about-video:after {
        bottom: -2px!important;
        height: 21px
    }

    section.about-video {
        padding-top: 40px;
        padding-bottom: 61px;
        background-size: 142%
    }

    img.video-play {
        width: 60px;
        top: calc(50% + 10px)
    }

    section.wallet-type {
        padding-top: 40px
    }

    .wallet-card.text-center {
        margin-bottom: 40px
    }

    h1.faq-main-title {
        font-size: 30px
    }

    section.faq.pb-100 {
        padding-top: 45px
    }

    section.security {
        padding-bottom: 70px
    }

    h1.team-title {
        width: 100%;
        text-align: center;
        font-size: 33px
    }

    .row.vcenter-item.lastrow {
        flex-direction: column-reverse!important
    }

    img.security-img {
        margin-top: 55px
    }

    section.invest.pt-150.pb-150 {
        padding-bottom: 50px
    }

    h1.security-title {
        font-size: 31px;
        text-align: center;
        line-height: 48px
    }

    section.about:before {
        bottom: -180px;
        height: 420px;
        width: 100%;
        left: 0
    }

    section.about:after {
        height: 24px;
        bottom: -5px!important
    }

    .video-thumbnail {
        width: 68%;
        top: 10px
    }

    h1.about-v-title {
        margin-bottom: 30px
    }

    .chart-config h3 {
        font-size: 36px;
        margin-bottom: 10px;
        text-align: center
    }

    section.calculator {
        padding-top: 70px
    }

    .chart-config ul li {
        width: 47%;
        float: right
    }

    .chart-config ul li a {
        width: 100%;
        padding: 15px 14px
    }

    h4.chart-calc {
        font-size: 17px
    }

    h4.chart-calc i {
        width: 25px;
        height: 25px;
        font-size: 11px;
        line-height: 25px
    }

    ul#pills-tab li {
        display: inline-block;
        width: 50%
    }

    ul#pills-tab li button {
        display: inline-block;
        padding: 0 0 13px!important
    }

    ul#pills-tab {
        margin: 0 auto;
        float: none;
        text-align: center
    }

    section.team.pb-150 {
        padding-top: 55px
    }

    .chart-config p {
        text-align: center
    }

    .highcharts-container {
        margin-top: 28px
    }

    div#teamcarousel img.team-active-img {
        width: 85%!important;
        display: block;
        margin: 0 auto 50px
    }

    div#teamcarousel h4.t-name {
        text-align: center;
        margin-bottom: 10px
    }

    div#teamcarousel {
        text-align: center;
        width: 90%;
        margin: 0 auto
    }

    div#teamcarousel p.t-quote {
        text-align-last: center
    }

    section.team:after {
        bottom: -1px
    }

    section.calculator:after {
        top: -1px
    }

    section.home-hero:after {
        bottom: -2px
    }

    section.home-hero:before {
        height: 80%;
        width: 120%
    }

    section.contact:after {
        bottom: auto!important;
        top: -4px;
        height: 25px
    }

    section.contact {
        overflow: hidden
    }

    a#play-video:before {
        top: calc(50% + 10px);
        width: 50px;
        height: 50px
    }

    div#video-overlay iframe {
        width: 90%;
        height: 210px
    }

    img.wallet-coin {
        display: none
    }

    section.why-invest {
        background-size: cover
    }

    img.about-v-t-icon {
        margin-top: 0;
        width: 35px;
        margin-right: 5px
    }

    h1.wallet-title {
        line-height: 45px
    }

    section.cta.pt-150.pb-150 {
        padding: 70px 0 110px
    }

    p.wallet-card-para {
        margin-bottom: 20px
    }

    .wallet-card .card-img-overlay {
        top: calc(50%)
    }

    img.invest-img {
        padding-right: 0;
        margin-top: 55px
    }

    img.about-s-img {
        margin-bottom: 140px
    }

    section.about:before {
        bottom: 0;
        height: 19%
    }

    section.about:after {
        bottom: -3px!important;
        border-bottom: 5px solid #f7f7f7
    }

    div#myChart .highcharts-container {
        margin-bottom: -45px;
        margin-top: 70px
    }

    div#myChart {
        position: relative;
        min-height: 270px!important
    }

    ul#pills-tab li button {
        font-size: 11px;
        width: 95%;
        margin: 0 auto
    }

    ul#pills-tab li {
        float: none;
        margin: 0 auto;
        display: block
    }

    h4.chart-calc {
        margin-bottom: 20px
    }

    .rang-sliders {
        margin-bottom: 30px
    }

    p.cls-para {
        font-size: 13px
    }

    h4.cls-nbr {
        font-size: 15px
    }
}

@media (min-width: 601px) and (max-width:820px) {
    section.home-hero .content {
        margin-top:-30px;
        padding: 17px 17px 0
    }
}

@media (max-width: 499px) and (min-width:0px) {
    section.home-hero .content {
        margin-top:20px;
        margin-bottom: 1.5rem;
        text-align: center
    }
}

@media (max-width: 1366px) and (min-width:0px) {
    h1.page-hero-title {
        font-size:27px
    }

    h4.page-hero-sub-title {
        font-size: 17px
    }

    p.page-hero-p {
        font-size: 15px
    }

    a.main-btn {
        padding-top: 5px;
        padding-bottom: 10px
    }

    section.page-hero .content {
        padding-top: 60px
    }

    p.foi-para {
        font-size: 12.5px
    }

    .foi-card {
        min-height: 255px
    }

    img.foi-img {
        width: 65px;
        margin-bottom: 10px
    }

    h4.foi-title {
        font-size: 20px;
        margin-bottom: 15px
    }

    p.foi-para {
        font-size: 12px
    }

    h1.fruits-of-investment-title,h1.iw-title {
        font-size: 35px
    }

    p.iw-para {
        font-size: 17px
    }

    h1.iw-wallet-title {
        font-size: 22px
    }

    p.iw-wallet-para {
        font-size: 14px
    }

    .wallet-range,section.investment-wallets .main-title {
        margin-bottom: 20px
    }

    h1.iw-title {
        margin-bottom: 15px
    }

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

    section.investment-wallets:before {
        height: 320px!important
    }

    .wallets-chart {
        width: 60%
    }

    h2.step-title {
        font-size: 24px
    }

    p.step-para {
        font-size: 14px
    }

    .container-steps {
        width: 75.2%;
        left: .2%
    }

    .step-box {
        top: 0;
        padding-left: 20px
    }

    .header.fixed img.fix-logo {
        width: 100px
    }

    .header.fixed {
        height: 86px
    }

    canvas#withdrawal-desktop {
        right: -110px;
        top: 25vh;
        width: 70%
    }

    ul.navbar-nav.left-nav li a.nav-link.btn-login-1 {
        min-width: 110px;
        padding: 5px 5px 10px!important;
        text-align: center
    }

    .percent {
        width: 60%;
        top: -58px
    }

    .percent h4 {
        font-size: 13px;
        width: calc(100% / 4.3)
    }

    h4.participent-title {
        font-size: 25px
    }

    span.part-card-percent {
        font-size: 21px
    }

    span.part-card-text {
        font-size: 17px
    }

    span.part-card-bar {
        height: 5px
    }

    section.new_participent {
        padding: 0 23px
    }

    h4.participent-title {
        margin-bottom: 25px;
        display: block
    }

    section.new_participent .hide-mobile {
        display: none
    }

    section.new_participent .hide-desktop {
        display: block!important
    }

    .participent-card.p-c-1 {
        margin-top: 25px
    }
}

@media (max-width: 992px) and (min-width:0px) {
    .shariyah-btn-wrapper {
        text-align:center
    }

    img.phone-hero {
        position: relative
    }

    section.page-hero .row {
        flex-direction: column-reverse!important
    }

    section.page-hero {
        height: auto
    }

    img.phone-hero {
        width: 100%;
        bottom: -40px;
        left: 0;
        right: 0;
        height: auto;
        margin-top: 15px
    }

    section.page-hero .content {
        padding-top: 140px;
        width: 90%;
        margin: 0 auto;
        text-align: start
    }

    .sm-hidden {
        display: none
    }

    .lg-hidden {
        display: initial
    }

    .header.fixed img.fix-logo {
        width: 100px;
        margin-right: 20px
    }

    .header.fixed {
        height: 82px
    }

    .hide-mobile.blank-step {
        display: none
    }

    h4.step-nbr {
        position: absolute;
        right: -25px;
        top: -3px
    }

    .step-box {
        position: relative;
        margin-bottom: 70px;
        right: 25px
    }

    img.step-img.hide-desktop {
        display: block;
        top: 0;
        height: auto;
        width: 100px;
        margin: 0 0 20px;
        right: 55px;
        position: relative
    }

    section.atp-steps:before {
        position: absolute;
        content: "";
        width: 15px;
        height: calc(100% + 13px);
        background: #f3f3f3;
        top: 0;
        bottom: 0;
        right: 61px;
        z-index: 999
    }

    img.phone-hero {
        z-index: 9999
    }

    h4.step-nbr {
        z-index: 999
    }

    h1.atp-steps-title {
        font-size: 30px;
        font-weight: 700;
        color: #243161;
        margin-bottom: 70px
    }

    section.atp-steps {
        padding-top: 100px;
        padding-bottom: 30px
    }

    section.investment-wallets .main-title {
        width: 90%;
        margin-bottom: 30px
    }

    section.investment-wallets {
        padding-left: 15px;
        padding-right: 15px
    }

    label.select-label {
        color: #50aede;
        font-weight: 500;
        margin-bottom: 10px
    }

    select.select-wallet {
        background: #0b1744;
        color: #fff;
        border: none;
        border-radius: 10px;
        padding-bottom: 15px;
        margin-bottom: 25px;
        font-weight: 500;
        background-image: url(/wp-content/themes/theforest/images/arrow-down.svg);
        background-repeat: no-repeat;
        background-position: left .75rem center;
        background-size: 26px 22px
    }

    div#adventure-wallet,div#moderate-wallet,div#quiet-wallet,div#risky-wallet {
        display: none
    }

    section.investment-wallets:before {
        height: 190px!important;
        background-position: 50%;
        left: 0;
        right: 0
    }

    .wallets-chart {
        width: 100%;
        margin-top: 20px
    }

    div#quiet-wallet {
        display: block
    }

    h1.fruits-of-investment-title {
        font-size: 30px
    }

    .foi-card {
        min-height: inherit;
        width: 90%;
        margin: 13px auto
    }

    .foi-card-content {
        position: relative;
        top: auto;
        transform: none;
        padding: 30px 0
    }

    section.fruits-of-investment {
        padding-bottom: 70px;
        margin-top: -30px
    }

    section.investment-wallets:after {
        top: -2px
    }

    h1.atp-steps-title {
        display: block
    }

    section.fruits-of-investment:before {
        height: 110%
    }

    .s-hidden {
        visibility: hidden;
        padding-right: 10px
    }

    .select {
        cursor: pointer;
        display: block;
        position: relative
    }

    .styledSelect {
        background: #0b1744;
        color: #fff;
        border: none;
        margin-bottom: 25px;
        font-weight: 500;
        background-image: url(/wp-content/themes/theforest/images/arrow-down.svg);
        background-repeat: no-repeat;
        background-position: left .75rem center;
        background-size: 26px 22px;
        top: 0;
        bottom: 0;
        height: 50px;
        line-height: 45px;
        padding-right: 20px
    }

    .options,.styledSelect {
        position: absolute;
        border-radius: 10px;
        left: 0;
        right: 0
    }

    .options {
        display: none;
        top: 100%;
        z-index: 99999;
        margin: 0;
        padding: 0;
        list-style: none;
        background-color: #0b1744;
        box-shadow: 0 1px 2px rgba(0,0,0,.2)
    }

    .options li {
        margin: 0;
        padding: 7px 20px 12px;
        border-radius: 10px
    }

    .options li:hover {
        background-color: #50aede;
        color: #fff
    }

    section.investment-wallets:after {
        display: none
    }

    img.calc-shape-t-mobile {
        width: 100%
    }

    .investment-wallets-mobile-top {
        display: block;
        position: absolute;
        left: 0;
        right: 0;
        top: -90px;
        z-index: 999
    }

    section#investment-wallets {
        padding-top: 0;
        margin-top: 70px
    }

    ul.navbar-nav.left-nav {
        margin-top: 0
    }

    .how-to-start:before {
        display: none
    }

    ul.navbar-nav.left-nav li a,ul.navbar-nav.left-nav li div {
        color: #243161!important
    }

    section.contact {
        padding-top: 70px
    }

    section.faq {
        padding-bottom: 70px
    }

    section.team:after {
        height: 50px
    }

    section.team {
        padding-top: 30px!important
    }

    p.about-p.p-last {
        margin-bottom: 60px!important
    }

    section.about .about-s-img {
        margin-bottom: 50px
    }

    section.about:before {
        display: none
    }

    .about-arrow-mobile-bottom.hide-desktop {
        display: block;
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0
    }

    img.about-arrow-mobile {
        width: 100%;
        height: 700px;
        position: relative;
        object-fit: cover;
        z-index: 1
    }

    img.about-arrow-mobile[data-lang=en] {
        width: 100%;
        height: 570px;
        position: relative;
        object-fit: cover;
        z-index: 1
    }

    section.about {
        padding-top: 70px!important
    }

    section.header.mobile-nav nav.navbar.navbar-expand-lg.main-navbar {
        background: #fff;
        position: fixed
    }

    .header.fixed img.main-logo {
        width: 100px!important
    }

    section.about,section.about[data-lang=en] {
        background-image: none
    }

    canvas#about-img,canvas#about-img[data-lang=en] {
        left: 0;
        width: 90%;
        z-index: 99
    }

    section.about:after {
        height: 29px
    }

    section.investment-wallets {
        background-image: none
    }

    canvas#withdrawal {
        top: auto;
        bottom: 90px;
        z-index: 1;
        width: 100%
    }

    p.about-p {
        text-align: center;
        position: relative;
        z-index: 10
    }

    section#team {
        margin-top: -2px
    }

    section.why-invest:before {
        left: 0;
        top: 40px
    }

    section.why-invest:after,section.why-invest:before {
        content: "";
        position: absolute;
        background-image: url(/wp-content/themes/theforest/images/why-invest-bg.svg?v=1.2);
        background-size: cover;
        background-repeat: no-repeat;
        width: 100%;
        height: 160px
    }

    section.why-invest:after {
        background-position: 100%;
        right: 0;
        top: 50px
    }

    footer ul.social-icons {
        text-align: center
    }

    footer .footer-email a {
        text-align: center;
        margin-top: 0!important
    }

    .capital-market {
        width: 100%;
        padding: 0 10%
    }

    img.phone-hero {
        width: 70%;
        left: auto;
        right: -40px
    }

    section.atp-steps[dir=ltr]:before {
        left: 30px
    }

    section.atp-steps[dir=rtl]:before {
        right: 30px
    }

    h4.step-nbr[dir=rtl] {
        right: -54px
    }

    h4.step-nbr[dir=ltr] {
        left: -24px
    }

    .step-box {
        padding-right: 0
    }

    img.step-img.hide-desktop[dir=rtl] {
        right: 25px
    }

    img.step-img.hide-desktop[dir=ltr] {
        left: 25px
    }

    img.phone-hero-coin {
        position: absolute;
        bottom: -30px;
        right: 8px;
        z-index: 9999;
        width: 37px
    }

    .phone-hero-deiv {
        position: relative
    }

    img.phone-hero-coin {
        z-index: -1
    }

    h4.step-nbr,section.atp-steps:before {
        z-index: -2
    }

    h4.chart-calc i:after {
        right: auto;
        left: 20px;
        bottom: 30px;
        background: #44608e
    }

    .is_mobile h4.chart-calc i:hover:after {
        display: none
    }

    .is_mobile h4.chart-calc i.active-i:after {
        display: block
    }

    div#myChart {
        height: 300px!important
    }

    div#highcharts-yuanl75-0 {
        height: 270px!important
    }

    canvas#withdrawal-desktop {
        display: none
    }

    canvas#withdrawal {
        display: block
    }

    section.about:after {
        bottom: -4px!important
    }

    label.numbers_ranged {
        display: inline-flex;
        align-items: center
    }

    div#teamcarousel p.t-quote {
        text-align: center;
        direction: rtl
    }

    h1.invest-title,h1.security-title {
        font-size: 23px
    }

    h4.chart-calc {
        font-size: 12px
    }

    p.invest-para,p.security-para {
        text-align: center
    }

    img#shariyah-img {
        float: inherit;
        width: 60%;
        margin-top: 50px
    }

    div#teamcarousel img.team-active-img {
        z-index: 1
    }

    img.mobile-team-slider-btn {
        width: 30px!important;
        position: absolute;
        top: 225px;
        left: 7.5%;
        cursor: pointer;
        z-index: 999!important
    }

    ul.navbar-nav.left-nav[dir=ltr] li {
        width: 100%;
        display: inline-flex;
        right: 5%!important;
        position: relative
    }

    ul.navbar-nav.left-nav[dir=rtl] li {
        width: 100%;
        display: inline-flex;
        left: 5%!important;
        position: relative
    }

    .gray-border {
        display: none
    }

    ul.navbar-nav.left-nav {
        display: inline;
        width: 90%
    }

    li.nav-item.how-to-start {
        margin-right: 0
    }

    li.nav-item.li-icon-user {
        width: 13%!important;
        border-bottom: none!important;
        bottom: 2px
    }

    ul.navbar-nav.left-nav li:last-child {
        width: 85%;
        display: inline-block
    }

    li.nav-item.li-icon-user a.nav-link img {
        width: 40px;
        height: 40px
    }

    li.nav-item.li-icon-user a.nav-link {
        padding: 0!important
    }

    section.financial-records p.invest-para {
        padding: 0
    }

    section.financial-records {
        padding-top: 50px
    }

    ul.financial-ul li {
        text-align: center;
        display: grid
    }

    ul.financial-ul li img {
        margin: 10px auto 0
    }

    .download-record {
        width: 100%;
        margin: 25px auto 0
    }

    a.main-btn.btn-download {
        padding: 0!important;
        font-size: 15px
    }

    img.financial-records-img {
        margin-top: 50px
    }

    p.atp-structure-para {
        margin-bottom: 40px
    }

    img.pyramid-mobile-img {
        margin-bottom: 40px;
        width: 100%
    }

    .pyramid-card-content {
        text-align: start
    }

    h4.pyramid-title {
        color: #23397e;
        font-size: 22px;
        font-weight: 600;
        margin-bottom: 10px
    }

    p.pyramid-para {
        color: #000000ad;
        font-size: 16px;
        line-height: 30px;
        margin-bottom: 30px
    }

    section.atp-structure {
        padding-bottom: 40px
    }

    section.atp-structure .vcenter-item {
        width: 95%;
        margin: 0 auto
    }

    section.financial-records .vcenter-item {
        width: 100%;
        margin: 0 auto
    }

    section.financial-activities .vcenter-item {
        width: 95%;
        margin: 0 auto
    }

    hr.pyramid-hr {
        width: 70%;
        margin: 10px auto 0
    }

    p.atp-structure-para {
        width: 92%
    }

    .financial-activitie-box {
        min-height: auto
    }

    .financial-activitie-box:first-child {
        margin-bottom: 25px
    }

    section.financial-activities {
        padding-bottom: 30px
    }

    .pdf-home-btn-download-div {
        margin-top: 80px
    }

    a.main-btn.btn-download.pdf-home-btn-download {
        padding: 0 40px!important;
        margin: 0 auto;
        display: block!important;
        float: inherit;
        width: 70%
    }

    section.financial-records .row {
        flex-direction: column-reverse
    }

    section.financial-records {
        padding-top: 0
    }

    section.financial-records img.financial-records-img {
        margin-bottom: 20px;
        margin-top: 0
    }

    section.financial-records a.main-btn.btn-download {
        padding: 0 30px!important
    }

    section.financial-records select#slct {
        float: right
    }

    p.footer-para {
        width: auto
    }

    .structure-btn-wrapper a.shariyah-btn {
        width: 80%;
        line-height: 30px
    }

    .pyramid-card-content:last-child p.pyramid-para {
        margin-bottom: 0
    }

    hr.pyramid-hr {
        margin-top: 50px
    }

    section.atp-structure {
        padding-top: 50px
    }

    p.footer-para {
        line-height: 30px
    }

    img.footer-logo {
        display: block;
        margin: 0 auto 25px
    }

    p.footer-para {
        line-height: 23px;
        text-align: center;
        margin-bottom: 35px
    }

    section.financial-records select#slct {
        background: transparent
    }

    hr.pyramid-hr.financial-hr {
        margin-bottom: 60px;
        margin-top: 0
    }

    section.financial-activities {
        padding-bottom: 10px
    }

    li.nav-item.li-icon-user {
        width: 85%;
        display: block!important
    }

    ul.navbar-nav.left-nav li a.nav-link.btn-login-1 {
        margin: 25px 10px 0 0;
        padding: 11px 1px 15px!important;
        display: block!important
    }
}

@media (max-width: 380px) and (min-width:0px) {
    section.about:after {
        height:27px
    }
}

@media (max-width: 992px) and (min-width:0px) {
    section.header.page-blog.fixed button.navbar-toggler svg path {
        stroke:#000!important
    }

    .btn-div-share {
        margin-top: 35px;
        text-align: center!important;
        float: none;
        width: 100%;
        display: block
    }

    .comment-container {
        margin-left: 45px
    }

    input.comment {
        width: 100%;
        display: block;
        margin-bottom: 10px
    }

    button.comment-btn {
        width: 100%!important;
        display: block;
        margin: 0!important
    }

    form.comment-input-div {
        display: block;
        margin-top: 35px;
        margin-left: 45px;
        margin-bottom: 45px
    }

    .related-post .owl-nav {
        display: none
    }

    p.comment-para {
        font-size: 13px
    }

    h6.comment-time {
        font-size: 10px
    }

    span.replies-nbr {
        font-size: 11px
    }

    .comment-react img {
        width: 15px
    }

    .single-blog-header {
        margin: 0
    }

    .single-post .breadcrumbs {
        display: none
    }

    section.single-hero:before {
        bottom: 30px;
        width: 80px
    }

    section.single-hero:after {
        width: 70px;
        top: 110px
    }

    .post-content,.post-inner {
        margin-right: 0
    }

    img.blog-hero-img {
        max-width: 100%
    }

    section.blog-hero {
        height: 45vh
    }

    section.blog-hero .container {
        align-items: start;
        padding-top: 15vh
    }

    .search-div {
        width: 100%
    }

    section.blog-hero .content {
        text-align: center;
        padding: 0 10px
    }

    section.header.page-blog button.navbar-toggler svg path {
        stroke: #fff!important
    }

    .second-special-post .row {
        flex-direction: column-reverse
    }

    button.btn.btn-pagination-next,button.btn.btn-pagination-prev {
        font-size: 10px
    }

    li.page--link a {
        width: 30px;
        height: 30px;
        padding-top: 11px
    }

    .page--link.page--link--current {
        width: 29px;
        height: 29px
    }

    button.btn.btn-pagination-next img,button.btn.btn-pagination-prev img {
        width: 9px
    }

    li.page--link a {
        font-size: 14px
    }

    .filter-block {
        float: none
    }

    .main-special-post {
        margin-bottom: 25px
    }

    .blog img.post-blog-thumbnail {
        height: 240px;
        min-height: auto
    }

    .second-special-post img.post-thumbnail {
        height: 240px;
        margin-bottom: 25px
    }

    .second-special-post {
        height: auto
    }

    section.latest-post {
        padding-top: 20px
    }

    section.latest-post,section.special-post {
        margin: 0 10px
    }

    section.header.page-blog.mobile-nav button.navbar-toggler svg path {
        stroke: #000!important
    }

    .header.page-blog.mobile-nav img.main-logo {
        display: none
    }

    section.header.page-blog.mobile-nav img.fix-logo {
        display: block;
        width: 100px;
        margin-right: 20px
    }

    .percent {
        width: 100%;
        top: -43px
    }

    .percent h4 {
        width: calc(100% / 4.55);
        font-size: 10px;
        font-weight: 900
    }

    .faq-cat-btn {
        margin-bottom: 0
    }

    .faq-category-div .col-md-3 {
        width: 50%
    }

    ul.navbar-nav.left-nav li a.nav-link.btn-login-1 {
        width: 100%
    }

    body.page ul.navbar-nav.left-nav li a.btn-login {
        width: 100%;
        padding: 16px 1px!important;
        min-width: auto!important;
        margin-left: 45px!important
    }

    h4.participent-title {
        font-size: 19px!important;
        margin-top: 45px
    }

    .faq-cat-btn {
        font-size: 14px;
        font-weight: 700
    }

    img.cat-icon {
        width: 18px
    }

    li.nav-item.li-icon-user {
        overflow: hidden;
        width: 50%!important;
        display: inline-block!important
    }

    ul.navbar-nav.left-nav li:last-child {
        width: 100%!important;
        text-align: center!important;
        display: inline-block!important
    }

    .float-btn {
        float: left;
        width: 49%!important;
        border-bottom: 0 solid transparent!important
    }

    ul.navbar-nav.left-nav li:last-child[dir=rtl] {
        width: 100%!important
    }

    ul.navbar-nav.left-nav li a.btn-login {
        width: initital!important;
        padding: 15px 21px!important;
        min-width: auto!important;
        margin-right: 0;
        border-bottom: 0
    }

    ul.navbar-nav.left-nav li a.nav-link.btn-login-1 {
        width: auto!important
    }

    .sm-btn-li[dir=ltr] {
        right: 5%!important
    }

    .sm-btn-li[dir=ltr],.sm-btn-li[dir=rtl] {
        width: 49%!important;
        display: inline-block!important;
        border: 0 solid transparent!important
    }

    .sm-btn-li[dir=rtl] {
        left: 5%!important
    }

    .toggle-lang-container {
        left: 0!important;
        text-align: start;
        margin: 0;
        float: left!important;
        left: -5%!important;
        width: 100%!important
    }

    .toggle-lang-container a {
        text-align: start
    }

    .ms-10px[dir=rtl] {
        margin-left: 10px!important;
        margin-right: 0!important
    }

    .ms-10px[dir=ltr] {
        margin-right: 10px!important;
        margin-left: 0!important
    }

    li.nav-item.li-icon-user {
        float: right!important;
        width: 49%!important
    }

    li.nav-item.li-icon-user a {
        margin-right: 0!important
    }
}

@media only screen and (max-width: 450px) {
    .home-hero-p {
        color:#fff!important
    }
}

@media (max-width: 1366px) and (min-width:0px) {
    .section.blog-hero {
        height:45vh
    }
}

@media (min-width: 320px) {
    h1.home-hero-title {
        font-size:30px
    }

    h1.home-hero-title-md {
        font-size: 32px
    }
}

@media (min-width: 320px) and (max-width:767px) {
    .navbar {
        --bs-navbar-padding-y:0rem!important;
        --bs-navbar-padding-x: 0rem!important;
        margin-top: .5rem;
        margin-bottom: .5rem;
        -ms-overflow-style: none;
        scrollbar-width: none
    }

    .navbar::-webkit-scrollbar {
        display: none
    }

    .sm-disable-container {
        --bs-gutter-x: 0rem;
        --bs-gutter-y: 0rem
    }

    .list-links {
        justify-content: center
    }

    .navbar-toggler {
        margin-left: .5rem
    }

    .sm-text-center {
        text-align: center!important
    }

    .grid-2 {
        grid-template-columns: 1fr
    }

    .privay-title {
        font-size: 1.5rem
    }

    .banner {
        max-width: -moz-fit-content;
        max-width: fit-content;
        width: 350px
    }

    .row-zakat {
        gap: 1rem;
        flex-direction: column
    }

    .app_banner {
        width: 380px
    }
}

@media (max-width: 450px) {
    .student-banner {
        z-index:90;
        position: absolute;
        bottom: 0;
        height: 35vh;
        right: 10%
    }

    section.home-hero {
        min-height: 90vh!important;
        height: 90vh!important;
        position: relative
    }

    .download-text {
        color: #34c9be;
        font-size: 35px
    }

    .app_banner {
        width: 300px
    }
}

@media only screen and (max-width: 450px) {
    .right-edge {
        width:85%
    }

    .logo-center {
        transform: translate(-25%,10%);
        width: 60px
    }

    .bottom-edge {
        height: 80px
    }

    .mb-3rem {
        margin-bottom: 3rem!important
    }
}

@media (max-width: 499px) {
    .banner {
        max-width:-moz-fit-content;
        max-width: fit-content;
        width: 350px
    }

    .row-zakat {
        flex-direction: column
    }
}

@media (min-width: 500px) {
    h1.home-hero-title {
        font-size:35px
    }

    h1.home-hero-title-md {
        font-size: 38px
    }
}

@media (min-width: 451px) and (max-width:600px) {
    .student-banner {
        z-index:90;
        position: absolute;
        bottom: 0;
        height: 35vh;
        right: 22.5%
    }

    section.home-hero {
        height: 90vh;
        position: relative
    }
}

@media only screen and (max-width: 600px) {
    .sm-hidden {
        display:none;
        opacity: 0;
        visibility: hidden
    }
}

@media (min-width: 601px) and (max-width:768px) {
    .student-banner {
        z-index:90;
        position: absolute;
        bottom: 0;
        height: 42vh;
        right: -2.5%
    }

    section.home-hero .content {
        padding-right: 0;
        padding-bottom: 0
    }

    .center-flex {
        justify-items: center;
        justify-content: center;
        justify-self: center
    }

    section.home-hero {
        height: 90vh!important;
        position: relative
    }
}

@media (max-width: 768px) {
    .bg-app-banner[dir=ltr] {
        right:0
    }

    .bg-app-banner[dir=rtl] {
        left: 0
    }

    .footer-links-grid {
        grid-template-columns: 1fr 1fr;
        gap: 8px 10px;
        margin: 12px 0 8px
    }

    .footer-additional-links {
        margin: 6px 0 12px
    }

    .footer-additional-links .list-links {
        justify-content: flex-end
    }

    footer ul.social-icons {
        justify-content: center;
        margin: 18px 0 8px
    }

    footer ul.social-icons li svg {
        width: 30px;
        height: 30px
    }

    footer ul.social-icons li img {
        width: 30px
    }

    .capital-market {
        text-align: center;
        margin-bottom: 18px
    }

    .apps-icons,.payment-icons {
        justify-content: center;
        margin: 12px 0
    }
}

@media (max-width: 480px) {
    .footer-links-grid {
        grid-template-columns:1fr;
        gap: 6px 0;
        margin: 10px 0 6px
    }

    .footer-additional-links {
        margin: 4px 0 10px
    }
}

@media (min-width: 768px) {
    h1.home-hero-title {
        font-size:45px
    }

    h1.home-hero-title-md {
        font-size: 48px
    }
}

@media only screen and (max-width: 769px) {
    .right-edge {
        width:25%;
        min-height: 90vh;
        max-height: 90vh
    }

    .logo-center {
        transform: translate(-25%,10%);
        width: 80px
    }

    .bottom-edge {
        height: 100px
    }

    .sm-img {
        display: inline
    }

    .md-img {
        display: none!important
    }

    .lg-img {
        display: none
    }
}

@media (min-width: 769px) and (max-width:820px) {
    .student-banner {
        z-index:90;
        position: absolute;
        bottom: 0;
        height: 40vh;
        right: -2.5%
    }

    section.home-hero {
        height: 90vh;
        position: relative
    }

    .center-flex {
        justify-items: center;
        justify-content: center;
        justify-self: center
    }
}

@media (min-width: 768px) and (max-width:992px) {
    .banner {
        width:350px;
        max-width: -moz-fit-content;
        max-width: fit-content
    }

    .row-zakat {
        gap: 1rem;
        flex-direction: column;
        align-items: center
    }

    .bg-app-banner[dir=ltr],.bg-app-banner[dir=rtl] {
        background: linear-gradient(#fff 50%,#24356e 0)
    }
}

@media (min-width: 821px) and (max-width:912px) {
    .student-banner {
        z-index:90;
        position: absolute;
        bottom: 0;
        height: 40vh;
        right: -2.5%
    }

    section.home-hero {
        height: 90vh;
        position: relative
    }

    .center-flex {
        justify-items: center;
        justify-content: center;
        justify-self: center
    }

    .app_banner {
        width: 575px
    }
}

@media (min-width: 913px) and (max-width:1024px) {
    .student-banner {
        z-index:90;
        position: absolute;
        bottom: 0;
        height: 85vh;
        right: -2.5%
    }

    section.home-hero {
        height: 90vh;
        position: relative
    }

    .app_banner {
        width: 550px
    }
}

@media (max-width: 992px) {
    .sm-100w {
        width:100%
    }
}

@media (min-width: 992px) {
    .collapse.navbar-collapse:not(.show) {
        text-align:left;
        display: block!important
    }
}

@media only screen and (max-width: 995px) {
    .right-edge {
        width:50%;
        min-height: 93vh;
        max-height: 93vh
    }

    .logo-center {
        transform: translate(-25%,125%);
        width: 125px
    }

    .bottom-edge {
        height: 115px
    }
}

@media (min-width: 960px) and (max-width:1550px) {
    section.page-hero {
        height:700px
    }

    h1.page-hero-title {
        font-size: 30px
    }

    h4.page-hero-sub-title {
        font-size: 20px
    }

    p.page-hero-p {
        font-size: 16px
    }

    section.page-hero .content {
        padding-top: 50px
    }

    img.phone-hero {
        height: 75vh;
        bottom: -50px;
        right: 11%
    }

    @media (max-height: 900px) and (min-height:721px) {
        img.phone-hero {
            height:70vh;
            bottom: -50px;
            right: 6%
        }

        h1.page-hero-title {
            font-size: 26px
        }

        p.page-hero-p {
            font-size: 13px
        }

        h4.page-hero-sub-title {
            font-size: 18px
        }
    }
}

@media (min-width: 1025px) and (max-width:1280px) {
    .student-banner {
        z-index:90;
        position: absolute;
        bottom: 0;
        height: 68vh;
        right: -2.5%
    }

    section.home-hero {
        height: 90vh;
        position: relative
    }

    .app_banner {
        width: 600px
    }

    .bg-app-banner[dir=ltr] {
        background: linear-gradient(90deg,#fff 60%,#24356e 0)
    }

    .bg-app-banner[dir=rtl] {
        background: linear-gradient(270deg,#fff 60%,#24356e 0)
    }
}

@media (min-width: 1281px) and (max-width:1440px) {
    .student-banner {
        z-index:90;
        position: absolute;
        bottom: 0;
        height: 75vh;
        right: -4.5%
    }

    section.home-hero {
        height: 90vh;
        position: relative
    }
}

@media (min-width: 1441px) and (max-width:1650px) {
    .student-banner {
        z-index:90;
        position: absolute;
        bottom: 0;
        height: 75vh;
        right: 0
    }

    section.home-hero {
        height: 90vh;
        position: relative
    }

    .hide-mobile.blank-step {
        height: 130px
    }
}

@media (min-width: 1490px) {
    .sm-img {
        display:none
    }

    .lg-img {
        display: inherit
    }

    .md-img {
        display: none
    }
}

@media (min-width: 768px) and (max-width:1490px) {
    .lg-img,.sm-img {
        display:none
    }

    .md-img {
        display: inherit
    }
}

@media (min-width: 1650px) {
    .student-banner {
        z-index:90;
        position: absolute;
        bottom: 0;
        right: 4%;
        height: 90vh
    }

    section.home-hero {
        height: 90vh;
        position: relative
    }

    .hide-mobile.blank-step {
        height: 130px
    }
}

@media (min-width: 1920px) {
    .hide-mobile.blank-step {
        height:300px
    }
}

@media (max-width: 1280px) and (min-width:1280px) {
    @media (max-height:1024px) and (min-height:1024px) {
        img.phone-hero {
            height:70vh;
            bottom: -50px;
            right: 4%
        }
    }
}

@media (max-width: 1366px) and (min-width:1366px) {
    @media (max-height:768px) and (min-height:768px) {
        img.phone-hero {
            height:70vh;
            bottom: -50px;
            right: 12%
        }
    }
}

@media (max-width: 1440px) and (min-width:1280px) {
    @media (max-height:900px) and (min-height:800px) {
        img.phone-hero {
            height:72vh;
            bottom: -50px;
            right: 10%
        }

        section.page-hero .content {
            padding-right: 80px
        }
    }
}

@media (max-width: 1280px) and (min-width:960px) {
    img.step-img {
        width:150px;
        height: 150px;
        margin-bottom: -20px
    }

    .hide-mobile.blank-step {
        height: 0
    }

    .t-pt-200 {
        padding-top: 130px
    }

    .step-box {
        top: -25px;
        position: relative;
        padding: 0 10px
    }

    .container-steps {
        width: 76%
    }

    .step-box.step-img-bottom img.step-img {
        margin: 10px auto 0
    }
}

@media (max-width: 1366px) and (min-width:1281px) {
    img.step-img {
        width:150px;
        height: 150px;
        margin-bottom: -10px
    }

    .hide-mobile.blank-step {
        height: 0
    }

    .step-box {
        top: -10px;
        position: relative;
        padding: 0 10px
    }

    .container-steps {
        width: 76%
    }

    .step-box.step-img-bottom img.step-img {
        margin: 20px auto 0
    }
}

@media (max-width: 1440px) and (min-width:1367px) {
    img.step-img {
        width:150px;
        height: 150px
    }

    .hide-mobile.blank-step {
        height: 30px
    }

    .step-box {
        position: relative;
        padding: 0 20px
    }

    .container-steps {
        width: 76%
    }

    .step-box.step-img-bottom img.step-img {
        margin: 30px auto 0
    }
}

@media (max-width: 1600px) and (min-width:1441px) {
    img.step-img {
        width:200px;
        height: 200px
    }

    .hide-mobile.blank-step {
        height: 45px
    }

    .step-box {
        position: relative;
        padding: 0 20px
    }

    .container-steps {
        width: 76%
    }

    .step-box.step-img-bottom img.step-img {
        margin: 30px auto 0
    }
}

@media only screen and (min-width: 2560px) {
    section.page-hero {
        height:1120px
    }

    img.step-img {
        width: 250px;
        height: 450px
    }

    .hide-mobile.blank-step {
        height: 450px
    }

    .step-box {
        top: 50px;
        position: relative;
        padding: 0 20px
    }

    .container-steps {
        width: 76%
    }

    .step-box.step-img-bottom img.step-img {
        margin: 50px auto 0
    }
}

@media (max-width: 1366px) and (min-width:0) {
    li.financial-ul-list {
        font-size:12px
    }

    .financial-activitie-box {
        min-height: 330px
    }

    section.financial-records {
        padding-top: 0;
        padding-bottom: 50px
    }

    h1.atp-structure-title {
        font-size: 35px
    }

    p.atp-structure-para {
        width: 80%;
        font-size: 16px
    }

    p.financial-activities-para {
        font-size: 16px
    }

    p.f-a-subbox-para {
        font-size: 13px
    }

    h5.f-a-subbox-title {
        font-size: 14px
    }

    p.pyramid-para {
        font-size: 15px
    }

    section.financial-activities,section.atp-structure {
        padding-bottom: 70px
    }

    section.atp-structure .container {
        width: 80%
    }

    p.atp-structure-para {
        font-size: 14px;
        line-height: 27px;
        margin-bottom: 70px
    }
}

@media (min-width: 700px) {
    .faq-grid {
        gap:1rem;
        grid-template-columns: 1fr 1fr
    }
}

@media (min-width: 1400px) {
    .faq-grid {
        gap:1rem;
        grid-template-columns: 1fr 1fr 1fr 1fr
    }
}