/*
Template Name: Gstar - Personal Portfolio Template
Author: Mountain Theme
Author URI: https://templatemonster.com/authors/mountaintheme
Template URI: https://mountainclimbersstar.com/demo/html/gstar
Description: Personal Portfolio HTML Template
File Description: Main css file of the template
Version: 1.0.0
*/

/*------------------------------------------------------------------
[Table of Contents]
    + General
        - Variable Define
        - Common CSS
        - Helpers Classes
        - Buttons
        - Hamburger Menu
        - Preloader
    - Home Area
    - Demo Sites
    - Purchase Now
    - Footer
    - Back to Top
    - Dark Theme
------------------------------------------------------------------*/

/* [ General ] */
/*================================================== */

/*** Variable Define ***/
:root {
    --body-bg: #fff;
    --body-bg-2: #14151A;
    --section-bg: var(--body-bg);
    --common-bg: #f3f6f6;
    --common-bg-2: var(--section-bg);
    --common-bg-3: #a5b1c2;
    --theme-primary: #a3cb38;
    --theme-primary-rgb: 164, 203, 56, 0.9;
    --text-white: #fff;
    --text-off: #bdc3c7;
    --body-text: #778ca3;
    --heading-text: #222222;
    --heading-text-2: #636e72;
    --border-color: var(--common-bg-3);
    --border-color-2: #d9d9d9;
    --border-color-3: #eae8ef;
    --facebook: #316FF6;
    --x: #0F1318;
    --instagram: #C92E80;
    --linkdin: #0077B5;
    --github: #2B3137;
    --dribbble: #E34A85;
    --behance: #053CF7;
    --google: #DD4B39;
    --vimeo: #86C9EF;
    --skype: #00AFF0;
    --blogger: #FC4F08;
    --envelope: #6567A5;
}

:root .dark-theme {
    --body-bg: #222222;
    --body-bg-2: #14151A;
    --section-bg: #2A2A2A;
    --common-bg: var(--body-bg);
    --common-bg-2: var(--section-bg);
    --common-bg-3: #606060;
    --theme-primary: #a3cb38;
    --theme-primary-rgb: 164, 203, 56, 0.9;
    --text-white: #fff;
    --text-off: #636E72;
    --body-text: #948DAA;
    --heading-text: var(--text-white);
    --heading-text-2: #a6a6a6;
    --border-color: var(--common-bg-3);
    --border-color-2: #454545;
    --border-color-3: #3f4042;
    --facebook: #316FF6;
    --x: #0F1318;
    --instagram: #C92E80;
    --linkdin: #0077B5;
    --github: #2B3137;
    --dribbble: #E34A85;
    --behance: #053CF7;
    --google: #DD4B39;
    --vimeo: #86C9EF;
    --skype: #00AFF0;
    --blogger: #FC4F08;
    --envelope: #6567A5;
}

/*** Common CSS ***/
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html,
body {
    scroll-behavior: smooth;
}

body {
    font-family: 'Poppins', sans-serif;
    font-size: 16px;
    font-weight: 400;
    position: relative;
    height: 100%;
    width: 100%;
    color: var(--body-text);
    background: var(--body-bg-2);
    overflow-x: hidden;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--heading-text);
}

p:last-of-type {
    margin-bottom: 0;
}

a {
    color: var(--body-text);
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -ms-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

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

ol,
ul {
    margin: 0;
    padding: 0;
}

ol li,
ul li {
    list-style: none;
}

img {
    max-width: 100%;
    height: auto;
}

/* Page Content */
#page-content {
    padding: 24px 0 24px 0;
}

/* Selection */
::-webkit-selection {
    background-color: var(--theme-primary);
    color: #fff;
    text-shadow: none;
}

::-moz-selection {
    background-color: var(--theme-primary);
    color: #fff;
    text-shadow: none;
}

::selection {
    background-color: var(--theme-primary);
    color: #fff;
    text-shadow: none;
}

/* Text Field */
.form-group label {
    font-size: 14px;
    font-weight: 500;
    color: var(--heading-text);
    margin-bottom: 8px;
}

input.form-control:focus,
textarea.form-control:focus {
    outline: none;
    box-shadow: none;
    border-color: var(--theme-primary);
}

html[dir=rtl] input[type="email"].form-control {
    text-align: end;
}

input.form-control,
textarea.form-control {
    border: none;
    border: 1px solid var(--border-color-3);
    outline: none;
    width: 100%;
    height: 54px;
    margin-bottom: 0;
    padding: 11px 20px;
    border-radius: 4px;
    color: var(--body-text) !important;
    background: transparent !important;
    -webkit-box-shadow: none;
    box-shadow: none;
    display: block;
}

/* Input Placeholder */
input.form-control::-webkit-input-placeholder {
    color: var(--body-text);
    font-size: 16px;
    font-weight: 400;
    opacity: 1;
}

input.form-control:-moz-placeholder {
    color: var(--body-text);
    font-size: 16px;
    font-weight: 400;
    opacity: 1;
}

input.form-control::-moz-placeholder {
    color: var(--body-text);
    font-size: 16px;
    font-weight: 400;
    opacity: 1;
}

input.form-control:-ms-input-placeholder {
    color: var(--body-text);
    font-size: 16px;
    font-weight: 400;
    opacity: 1;
}

textarea.form-control::-webkit-input-placeholder {
    color: var(--body-text);
    font-size: 16px;
    font-weight: 400;
    opacity: 1;
}

textarea.form-control:-moz-placeholder {
    color: var(--body-text);
    font-size: 16px;
    font-weight: 400;
    opacity: 1;
}

textarea.form-control::-moz-placeholder {
    color: var(--body-text);
    font-size: 16px;
    font-weight: 400;
    opacity: 1;
}

textarea.form-control:-ms-input-placeholder {
    color: var(--body-text);
    font-size: 16px;
    font-weight: 400;
    opacity: 1;
}

/*** Helpers Classes ***/
/* Font Size */
.text {
    font-size: 11px;
}

.text-xs {
    font-size: 12px;
}

.text-sm {
    font-size: 14px;
}

.text-base {
    font-size: 16px;
}

.text-lg {
    font-size: 18px;
}

.text-xl {
    font-size: 20px;
}

.text-2xl {
    font-size: 24px;
}

.text-3xl {
    font-size: 28px;
}

.text-4xl {
    font-size: 32px;
}

.text-5xl {
    font-size: 36px;
}

.text-6xl {
    font-size: 40px;
}

.text-7xl {
    font-size: 44px;
}

.text-8xl {
    font-size: 48px;
}

.text-9xl {
    font-size: 52px;
}

.text-10xl {
    font-size: 56px;
}

.text-11xl {
    font-size: 60px;
}

.text-12xl {
    font-size: 64px;
}

.text-13xl {
    font-size: 72px;
}

.text-14xl {
    font-size: 80px;
}

.text-15xl {
    font-size: 84px;
}

.text-16xl {
    font-size: 92px;
}

.text-17xl {
    font-size: 96px;
}

.text-18xl {
    font-size: 104px;
}

.text-19xl {
    font-size: 112px;
}

.text-20xl {
    font-size: 124px;
}

.text-21xl {
    font-size: 128px;
}

.text-22xl {
    font-size: 132px;
}

.text-23xl {
    font-size: 144px;
}

.text-7xl,
.text-8xl,
.text-9xl,
.text-10xl,
.text-11xl,
.text-12xl,
.text-13xl,
.text-14xl,
.text-16xl,
.text-17xl,
.text-18xl,
.text-19xl,
.text-20xl,
.text-21xl,
.text-22xl,
.text-23xl {
    line-height: 1.3;
}

/* Font Weight */
.fw-100 {
    font-weight: 100 !important;
}

.fw-200 {
    font-weight: 200 !important;
}

.fw-300 {
    font-weight: 300 !important;
}

.fw-400 {
    font-weight: 400 !important;
}

.fw-500 {
    font-weight: 500 !important;
}

.fw-600 {
    font-weight: 600 !important;
}

.fw-700 {
    font-weight: 700 !important;
}

.fw-800 {
    font-weight: 900 !important;
}

/* Opacity */
.opaciyt-0 {
    opacity: 0;
}

.opacity-1 {
    opacity: 0.1;
}

.opacity-2 {
    opacity: 0.2;
}

.opacity-3 {
    opacity: 0.3;
}

.opacity-4 {
    opacity: 0.4;
}

.opacity-5 {
    opacity: 0.5;
}

.opacity-6 {
    opacity: 0.6;
}

.opacity-7 {
    opacity: 0.7;
}

.opacity-8 {
    opacity: 0.8;
}

.opacity-9 {
    opacity: 0.9;
}

.opacity-10 {
    opacity: 1;
}

/** Margin & Padding **/
/* Margin Top */
.mt-2 {
    margin-top: 2px;
}

.mt-4 {
    margin-top: 4px;
}

.mt-8 {
    margin-top: 8px;
}

.mt-12 {
    margin-top: 12px;
}

.mt-16 {
    margin-top: 16px;
}

.mt-18 {
    margin-top: 18px;
}

.mt-20 {
    margin-top: 20px;
}

.mt-24 {
    margin-top: 24px;
}

.mt-28 {
    margin-top: 28px;
}

.mt-32 {
    margin-top: 32px;
}

.mt-34 {
    margin-top: 34px;
}

.mt-40 {
    margin-top: 40px;
}

.mt-44 {
    margin-top: 44px;
}

.mt-48 {
    margin-top: 48px;
}

.mt-52 {
    margin-top: 52px;
}

.mt-56 {
    margin-top: 56px;
}

.mt-60 {
    margin-top: 60px;
}

.mt-64 {
    margin-top: 64px;
}

.mt-72 {
    margin-top: 72px;
}

.mt-76 {
    margin-top: 76px;
}

.mt-80 {
    margin-top: 80px;
}

.mt-88 {
    margin-top: 88px;
}

.mt-96 {
    margin-top: 96px;
}

.mt-104 {
    margin-top: 104px;
}

.mt-112 {
    margin-top: 112px;
}

.mt-120 {
    margin-top: 120px;
}

.mt-128 {
    margin-top: 128px;
}

.mt-136 {
    margin-top: 136px;
}

.mt-144 {
    margin-top: 144px;
}

.mt-152 {
    margin-top: 152px;
}

.mt-160 {
    margin-top: 160px;
}

.mt-168 {
    margin-top: 168px;
}

.mt-176 {
    margin-top: 176px;
}

.mt-184 {
    margin-top: 184px;
}

.mt-192 {
    margin-top: 192px;
}

.mt-200 {
    margin-top: 200px;
}

/* Margin Bottom */
.mb-2 {
    margin-bottom: 2px;
}

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

.mb-8 {
    margin-bottom: 8px;
}

.mb-12 {
    margin-bottom: 12px;
}

.mb-16 {
    margin-bottom: 16px;
}

.mb-18 {
    margin-bottom: 18px;
}

.mb-20 {
    margin-bottom: 20px;
}

.mb-24 {
    margin-bottom: 24px;
}

.mb-28 {
    margin-bottom: 28px;
}

.mb-32 {
    margin-bottom: 32px;
}

.mb-34 {
    margin-bottom: 34px;
}

.mb-40 {
    margin-bottom: 40px;
}

.mb-44 {
    margin-bottom: 44px;
}

.mb-48 {
    margin-bottom: 48px;
}

.mb-52 {
    margin-bottom: 52px;
}

.mb-56 {
    margin-bottom: 56px;
}

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

.mb-64 {
    margin-bottom: 64px;
}

.mb-72 {
    margin-bottom: 72px;
}

.mb-76 {
    margin-bottom: 76px;
}

.mb-80 {
    margin-bottom: 80px;
}

.mb-88 {
    margin-bottom: 88px;
}

.mb-96 {
    margin-bottom: 96px;
}

.mb-104 {
    margin-bottom: 104px;
}

.mb-112 {
    margin-bottom: 112px;
}

.mb-120 {
    margin-bottom: 120px;
}

.mb-128 {
    margin-bottom: 128px;
}

.mb-136 {
    margin-bottom: 136px;
}

.mb-144 {
    margin-bottom: 144px;
}

.mb-152 {
    margin-bottom: 152px;
}

.mb-160 {
    margin-bottom: 160px;
}

.mb-168 {
    margin-bottom: 168px;
}

.mb-176 {
    margin-bottom: 176px;
}

.mb-184 {
    margin-bottom: 184px;
}

.mb-192 {
    margin-bottom: 192px;
}

.mb-200 {
    margin-bottom: 200px;
}

/* Margin Left */
.ml-2 {
    margin-left: 2px;
}

.ml-4 {
    margin-left: 4px;
}

.ml-8 {
    margin-left: 8px;
}

.ml-12 {
    margin-left: 12px;
}

.ml-16 {
    margin-left: 16px;
}

.ml-18 {
    margin-left: 18px;
}

.ml-20 {
    margin-left: 20px;
}

.ml-24 {
    margin-left: 24px;
}

.ml-28 {
    margin-left: 28px;
}

.ml-32 {
    margin-left: 32px;
}

.ml-34 {
    margin-left: 34px;
}

.ml-40 {
    margin-left: 40px;
}

.ml-44 {
    margin-left: 44px;
}

.ml-48 {
    margin-left: 48px;
}

.ml-52 {
    margin-left: 52px;
}

.ml-56 {
    margin-left: 56px;
}

.ml-60 {
    margin-left: 60px;
}

.ml-64 {
    margin-left: 64px;
}

.ml-72 {
    margin-left: 72px;
}

.ml-76 {
    margin-left: 76px;
}

.ml-80 {
    margin-left: 80px;
}

.ml-88 {
    margin-left: 88px;
}

.ml-96 {
    margin-left: 96px;
}

.ml-104 {
    margin-left: 104px;
}

.ml-112 {
    margin-left: 112px;
}

.ml-120 {
    margin-left: 120px;
}

.ml-128 {
    margin-left: 128px;
}

.ml-136 {
    margin-left: 136px;
}

.ml-144 {
    margin-left: 144px;
}

.ml-152 {
    margin-left: 152px;
}

.ml-160 {
    margin-left: 160px;
}

.ml-168 {
    margin-left: 168px;
}

.ml-176 {
    margin-left: 176px;
}

.ml-184 {
    margin-left: 184px;
}

.ml-192 {
    margin-left: 192px;
}

.ml-200 {
    margin-left: 200px;
}

/* Margin Right */
.mr-2 {
    margin-right: 2px;
}

.mr-4 {
    margin-right: 4px;
}

.mr-8 {
    margin-right: 8px;
}

.mr-12 {
    margin-right: 12px;
}

.mr-16 {
    margin-right: 16px;
}

.mr-18 {
    margin-right: 18px;
}

.mr-20 {
    margin-right: 20px;
}

.mr-24 {
    margin-right: 24px;
}

.mr-28 {
    margin-right: 28px;
}

.mr-32 {
    margin-right: 32px;
}

.mr-34 {
    margin-right: 34px;
}

.mr-40 {
    margin-right: 40px;
}

.mr-44 {
    margin-right: 44px;
}

.mr-48 {
    margin-right: 48px;
}

.mr-52 {
    margin-right: 52px;
}

.mr-56 {
    margin-right: 56px;
}

.mr-60 {
    margin-right: 60px;
}

.mr-64 {
    margin-right: 64px;
}

.mr-72 {
    margin-right: 72px;
}

.mr-76 {
    margin-right: 76px;
}

.mr-80 {
    margin-right: 80px;
}

.mr-88 {
    margin-right: 88px;
}

.mr-96 {
    margin-right: 96px;
}

.mr-104 {
    margin-right: 104px;
}

.mr-112 {
    margin-right: 112px;
}

.mr-120 {
    margin-right: 120px;
}

.mr-128 {
    margin-right: 128px;
}

.mr-136 {
    margin-right: 136px;
}

.mr-144 {
    margin-right: 144px;
}

.mr-152 {
    margin-right: 152px;
}

.mr-160 {
    margin-right: 160px;
}

.mr-168 {
    margin-right: 168px;
}

.mr-176 {
    margin-right: 176px;
}

.mr-184 {
    margin-right: 184px;
}

.mr-192 {
    margin-right: 192px;
}

.mr-200 {
    margin-right: 200px;
}

/* Padding Top */
.pt-2 {
    padding-top: 2px;
}

.pt-4 {
    padding-top: 4px;
}

.pt-8 {
    padding-top: 8px;
}

.pt-12 {
    padding-top: 12px;
}

.pt-16 {
    padding-top: 16px;
}

.pt-18 {
    padding-top: 18px;
}

.pt-20 {
    padding-top: 20px;
}

.pt-24 {
    padding-top: 24px;
}

.pt-28 {
    padding-top: 28px;
}

.pt-32 {
    padding-top: 32px;
}

.pt-34 {
    padding-top: 34px;
}

.pt-40 {
    padding-top: 40px;
}

.pt-44 {
    padding-top: 44px;
}

.pt-48 {
    padding-top: 48px;
}

.pt-52 {
    padding-top: 52px;
}

.pt-56 {
    padding-top: 56px;
}

.pt-60 {
    padding-top: 60px;
}

.pt-64 {
    padding-top: 64px;
}

.pt-72 {
    padding-top: 72px;
}

.pt-76 {
    padding-top: 76px;
}

.pt-80 {
    padding-top: 80px;
}

.pt-88 {
    padding-top: 88px;
}

.pt-96 {
    padding-top: 96px;
}

.pt-104 {
    padding-top: 104px;
}

.pt-112 {
    padding-top: 112px;
}

.pt-120 {
    padding-top: 120px;
}

.pt-128 {
    padding-top: 128px;
}

.pt-136 {
    padding-top: 136px;
}

.pt-144 {
    padding-top: 144px;
}

.pt-152 {
    padding-top: 152px;
}

.pt-160 {
    padding-top: 160px;
}

.pt-168 {
    padding-top: 168px;
}

.pt-176 {
    padding-top: 176px;
}

.pt-184 {
    padding-top: 184px;
}

.pt-192 {
    padding-top: 192px;
}

.pt-200 {
    padding-top: 200px;
}

/* Padding Bottom */
.pb-2 {
    padding-bottom: 2px;
}

.pb-4 {
    padding-bottom: 4px;
}

.pb-8 {
    padding-bottom: 8px;
}

.pb-12 {
    padding-bottom: 12px;
}

.pb-16 {
    padding-bottom: 16px;
}

.pb-18 {
    padding-bottom: 18px;
}

.pb-20 {
    padding-bottom: 20px;
}

.pb-24 {
    padding-bottom: 24px;
}

.pb-28 {
    padding-bottom: 28px;
}

.pb-32 {
    padding-bottom: 32px;
}

.pb-34 {
    padding-bottom: 34px;
}

.pb-40 {
    padding-bottom: 40px;
}

.pb-44 {
    padding-bottom: 44px;
}

.pb-48 {
    padding-bottom: 48px;
}

.pb-52 {
    padding-bottom: 52px;
}

.pb-56 {
    padding-bottom: 56px;
}

.pb-60 {
    padding-bottom: 60px;
}

.pb-64 {
    padding-bottom: 64px;
}

.pb-72 {
    padding-bottom: 72px;
}

.pb-76 {
    padding-bottom: 76px;
}

.pb-80 {
    padding-bottom: 80px;
}

.pb-88 {
    padding-bottom: 88px;
}

.pb-96 {
    padding-bottom: 96px;
}

.pb-104 {
    padding-bottom: 104px;
}

.pb-112 {
    padding-bottom: 112px;
}

.pb-120 {
    padding-bottom: 120px;
}

.pb-128 {
    padding-bottom: 128px;
}

.pb-136 {
    padding-bottom: 136px;
}

.pb-144 {
    padding-bottom: 144px;
}

.pb-152 {
    padding-bottom: 152px;
}

.pb-160 {
    padding-bottom: 160px;
}

.pb-168 {
    padding-bottom: 168px;
}

.pb-176 {
    padding-bottom: 176px;
}

.pb-184 {
    padding-bottom: 184px;
}

.pb-192 {
    padding-bottom: 192px;
}

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

/* Padding Left */
.pl-2 {
    padding-left: 2px;
}

.pl-4 {
    padding-left: 4px;
}

.pl-8 {
    padding-left: 8px;
}

.pl-12 {
    padding-left: 12px;
}

.pl-16 {
    padding-left: 16px;
}

.pl-18 {
    padding-left: 18px;
}

.pl-20 {
    padding-left: 20px;
}

.pl-24 {
    padding-left: 24px;
}

.pl-28 {
    padding-left: 28px;
}

.pl-32 {
    padding-left: 32px;
}

.pl-34 {
    padding-left: 34px;
}

.pl-40 {
    padding-left: 40px;
}

.pl-44 {
    padding-left: 44px;
}

.pl-48 {
    padding-left: 48px;
}

.pl-52 {
    padding-left: 52px;
}

.pl-56 {
    padding-left: 56px;
}

.pl-60 {
    padding-left: 60px;
}

.pl-64 {
    padding-left: 64px;
}

.pl-72 {
    padding-left: 72px;
}

.pl-76 {
    padding-left: 76px;
}

.pl-80 {
    padding-left: 80px;
}

.pl-88 {
    padding-left: 88px;
}

.pl-96 {
    padding-left: 96px;
}

.pl-104 {
    padding-left: 104px;
}

.pl-112 {
    padding-left: 112px;
}

.pl-120 {
    padding-left: 120px;
}

.pl-128 {
    padding-left: 128px;
}

.pl-136 {
    padding-left: 136px;
}

.pl-144 {
    padding-left: 144px;
}

.pl-152 {
    padding-left: 152px;
}

.pl-160 {
    padding-left: 160px;
}

.pl-168 {
    padding-left: 168px;
}

.pl-176 {
    padding-left: 176px;
}

.pl-184 {
    padding-left: 184px;
}

.pl-192 {
    padding-left: 192px;
}

.pl-200 {
    padding-left: 200px;
}

/* Padding Right */
.pr-2 {
    padding-right: 2px;
}

.pr-4 {
    padding-right: 4px;
}

.pr-8 {
    padding-right: 8px;
}

.pr-12 {
    padding-right: 12px;
}

.pr-16 {
    padding-right: 16px;
}

.pr-18 {
    padding-right: 18px;
}

.pr-20 {
    padding-right: 20px;
}

.pr-24 {
    padding-right: 24px;
}

.pr-28 {
    padding-right: 28px;
}

.pr-32 {
    padding-right: 32px;
}

.pr-34 {
    padding-right: 34px;
}

.pr-40 {
    padding-right: 40px;
}

.pr-44 {
    padding-right: 44px;
}

.pr-48 {
    padding-right: 48px;
}

.pr-52 {
    padding-right: 52px;
}

.pr-56 {
    padding-right: 56px;
}

.pr-60 {
    padding-right: 60px;
}

.pr-64 {
    padding-right: 64px;
}

.pr-72 {
    padding-right: 72px;
}

.pr-76 {
    padding-right: 76px;
}

.pr-80 {
    padding-right: 80px;
}

.pr-88 {
    padding-right: 88px;
}

.pr-96 {
    padding-right: 96px;
}

.pr-104 {
    padding-right: 104px;
}

.pr-112 {
    padding-right: 112px;
}

.pr-120 {
    padding-right: 120px;
}

.pr-128 {
    padding-right: 128px;
}

.pr-136 {
    padding-right: 136px;
}

.pr-144 {
    padding-right: 144px;
}

.pr-152 {
    padding-right: 152px;
}

.pr-160 {
    padding-right: 160px;
}

.pr-168 {
    padding-right: 168px;
}

.pr-176 {
    padding-right: 176px;
}

.pr-184 {
    padding-right: 184px;
}

.pr-192 {
    padding-right: 192px;
}

.pr-200 {
    padding-right: 200px;
}

/*** Buttons ***/
.button {
    border: 0;
    width: max-content;
    display: inline-block;
    font-size: 16px;
    font-weight: 500;
    padding: 12px 24px;
    color: #FFF;
    border-radius: 14px;
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -ms-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
}

.button-coloured {
    background: var(--theme-primary);
}

.button-dark {
    background: var(--common-bg-3);
}

.button-coloured:hover,
.button-dark:hover {
    -webkit-box-shadow: inset 0px 0px 135px rgba(0, 0, 0, 0.25);
    -moz-box-shadow: inset 0px 0px 135px rgba(0, 0, 0, 0.25);
    -ms-box-shadow: inset 0px 0px 135px rgba(0, 0, 0, 0.25);
    -o-box-shadow: inset 0px 0px 135px rgba(0, 0, 0, 0.25);
    box-shadow: inset 0px 0px 135px rgba(0, 0, 0, 0.25);
}

/*** Hamburger Menu ***/
.hamburger-menu {
    padding: 0 12px !important;
    border-radius: 50%;
    outline: none !important;
    box-shadow: none !important;
    background: var(--theme-primary);
    height: 46px;
    width: 46px;
    vertical-align: middle;
    direction: ltr;
}

.hamburger-menu .line {
    display: block;
    height: 3px;
    width: 10px;
    margin-block: 4px;
    background-color: var(--text-white);
    border-radius: 8px;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -ms-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
}

.hamburger-menu .line-2 {
    width: 20px;
}

.hamburger-menu .line-3 {
    margin-inline-start: auto;
}

.hamburger-menu.active .line-2 {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.hamburger-menu.active .line-1 {
    -webkit-transform: rotate(45deg) translate(4px, 1.5px);
    -moz-transform: rotate(45deg) translate(4px, 1.5px);
    -ms-transform: rotate(45deg) translate(4px, 1.5px);
    -o-transform: rotate(45deg) translate(4px, 1.5px);
    transform: rotate(45deg) translate(4px, 1.5px);
}

.hamburger-menu.active .line-3 {
    -webkit-transform: rotate(45deg) translate(-3px, -1px);
    -moz-transform: rotate(45deg) translate(-3px, -1px);
    -ms-transform: rotate(45deg) translate(-3px, -1px);
    -o-transform: rotate(45deg) translate(-3px, -1px);
    transform: rotate(45deg) translate(-3px, -1px);
}

/*** Preloader ***/
.preloader {
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 999999999 !important;
    background-color: #fff;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}

.dark-theme .preloader {
    background: #000;
}

.loader {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    height: 4px;
    width: 134px;
    --c: no-repeat -webkit-linear-gradient(#6100ee 0 0);
    background: var(--c), var(--c), #d7b8fc;
    background-size: 60% 100%;
    -webkit-animation: preloader 3s infinite;
    animation: preloader 3s infinite;
}

@-webkit-keyframes preloader {
    0% {
        background-position: -150% 0, -150% 0
    }

    66% {
        background-position: 250% 0, -150% 0
    }

    100% {
        background-position: 250% 0, 250% 0
    }
}

@keyframes preloader {
    0% {
        background-position: -150% 0, -150% 0
    }

    66% {
        background-position: 250% 0, -150% 0
    }

    100% {
        background-position: 250% 0, 250% 0
    }
}

/* [ Home Area ] */
/*================================================== */
.home {
    z-index: 2;
    overflow: hidden;
    background: #0a090d;
}

.home::before {
    content: "";
    position: absolute;
    top: -200px;
    left: -200px;
    width: 400px;
    height: 400px;
    border-radius: 908px;
    background: #FF6900;
    filter: blur(200px);
    z-index: -1;
    opacity: .4;
}

.home .logo h3 {
    font-size: 52px;
    font-weight: 500;
    color: var(--heading-text);
    line-height: 1.1;
}

.home .logo h3 span {
    font-size: 58px;
    font-weight: 600;
    color: var(--theme-primary);
}

.home .logo .v {
    position: absolute;
    bottom: 32px;
    font-size: 12px;
    margin-left: 8px;
}

.home .home-content .col-12 p {
    color: var(--heading-text);
}

.home .home-content .col-12 p span {
    font-weight: 300;
}

.home .buy-now,
.purchase-now .buy-now {
    padding: 14px 20px;
    background: #FFF;
    color: #0F111A;
    font-size: 16px;
    font-weight: 400;
    border-radius: 50px;
    border: 1px solid transparent;
}

.home .buy-now img,
.purchase-now .buy-now img {
    max-width: 27px;
    margin-right: 2px;
}

.home .buy-now:hover,
.purchase-now .buy-now:hover {
    background: var(--common-bg);
    color: var(--text-white);
    border-color: var(--border-color-3);
}

/* [ Demo Sites ] */
/*================================================== */
.demo-site .demo-img {
    overflow: hidden;
    border-radius: 12px;
}

.demo-wrap.coming-soon .demo-img::before {
    content: unset;
}

.demo-site .demo-img::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #0a090d;
    opacity: 0;
    -webkit-transition: all .4s ease;
    transition: all .4s ease;
}

.demo-site .demo-wrap:hover .demo-img::before {
    opacity: .6;
}

.demo-site .live-demo-link {
    position: absolute;
    top: 60%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
    z-index: 1;
    color: #FFF;
    font-size: 18px;
    opacity: 0;
    -webkit-transition: all .4s ease;
    transition: all .4s ease;
}

.demo-site .demo-wrap:hover .live-demo-link {
    opacity: 1;
    top: 50%;
}

.demo-site .demo-wrap .live-demo-link:hover {
    color: var(--theme-primary);
}

.demo-site .demo-img img {
    width: 100%;
    border-radius: 12px;
    border: 2px solid var(--border-color-3);
}

.demo-site .demo-title span {
    color: var(--theme-primary);
}

/* [ Purchase Now ] */
/*================================================== */
.purchase-now {
    position: relative;
    background: #0a090d;
    overflow: hidden;
    z-index: 2;
}

.purchase-now::before {
    content: "";
    position: absolute;
    top: -240px;
    left: 50%;
    -webkit-transform: translate(-50%);
    transform: translate(-50%);
    width: 400px;
    height: 400px;
    border-radius: 908px;
    background: #FF6900;
    filter: blur(200px);
    z-index: -1;
    opacity: .4;
}

.purchase-now .col-12>p {
    color: var(--heading-text);
    margin-bottom: 32px;
    padding: 0 110px;
    line-height: 1.4;
}

.purchase-now .col-12>p span {
    color: var(--theme-primary);
}

/* [ Footer ] */
/*================================================== */
.footer {
    padding: 40px 0;
}

.footer p a {
    color: var(--theme-primary);
    font-weight: 500;
}

.footer p a:hover {
    text-decoration: underline;
}

/* [ Back to Top ] */
/*================================================== */
html[dir=rtl] #back-top-top {
    right: auto;
    left: 10px;
}

#back-top-top {
    position: fixed;
    bottom: -20px;
    right: 10px;
    width: 44px;
    height: 44px;
    line-height: 44px;
    text-align: center;
    border-radius: 50%;
    font-size: 18px;
    color: #FFF;
    background: #8A94AD;
    z-index: 111;
    opacity: 0;
    visibility: hidden;
}

#back-top-top:hover {
    color: #FFF !important;
}

#back-top-top.active {
    opacity: 1;
    visibility: visible;
    bottom: 8px;
}