/*!
Theme Name: geek-store
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 1.0.0
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: geek-store
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

geek-store is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/

/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Generic
	- Normalize
	- Box sizing
# Base
	- Typography
	- Elements
	- Links
	- Forms
## Layouts
# Components
	- Navigation
	- Posts and pages
	- Comments
	- Widgets
	- Media
	- Captions
	- Galleries
# plugins
	- Jetpack infinite scroll
# Utilities
	- Accessibility
	- Alignments

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

/*--------------------------------------------------------------
# Generic
--------------------------------------------------------------*/

/* Normalize
--------------------------------------------- */

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
	 ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */

html {
    line-height: 1.15;
    -webkit-text-size-adjust: 100%;
}

/* Sections
	 ========================================================================== */

/**
 * Remove the margin in all browsers.
 */

:root {
    --purple: #6659BF;
    --dark-gray: #333333;
    --black-color: #000000;
    --white-color: #ffffff;
}

body {
    margin: 0;
}

body,
html {
    overflow-x: hidden !important;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */

h1 {
    font-size: 2em;
}

/* Grouping content
========================================================================== */

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */

hr {
    box-sizing: content-box;
    /* 1 */
    height: 0;
    /* 1 */
    overflow: visible;
    /* 2 */
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

pre {
    font-size: 1em;
    /* 2 */
}

/* Text-level semantics
========================================================================== */

/**
 * Remove the gray background on active links in IE 10.
 */

a {
    background-color: transparent;
    text-decoration: none !important;
    outline: none !important;
}

/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */

abbr[title] {
    border-bottom: none;
    /* 1 */
    text-decoration: underline;
    /* 2 */
    text-decoration: underline dotted;
    /* 2 */
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */

b,
strong {
    font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

code,
kbd,
samp {
    font-size: 1em;
    /* 2 */
}

/**
 * Add the correct font size in all browsers.
 */

small {
    font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sub {
    bottom: -0.25em;
}

sup {
    top: -0.5em;
}

/* Embedded content
========================================================================== */

/**
 * Remove the border on images inside links in IE 10.
 */

img {
    border-style: none;
}

/* Forms
========================================================================== */

/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */

button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    /* 1 */
    font-size: 100%;
    /* 1 */
    line-height: 1.15;
    /* 1 */
    margin: 0;
    /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */

button,
input {
    /* 1 */
    overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */

button,
select {
    /* 1 */
    text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */

button,
[type="button"],
[type="reset"],
[type="submit"] {
    -webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */

/**
 * Correct the padding in Firefox.
 */

fieldset {
    padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *      `fieldset` elements in all browsers.
 */

legend {
    box-sizing: border-box;
    /* 1 */
    color: inherit;
    /* 2 */
    display: table;
    /* 1 */
    max-width: 100%;
    /* 1 */
    padding: 0;
    /* 3 */
    white-space: normal;
    /* 1 */
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

progress {
    vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */

textarea {
    overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */

[type="checkbox"],
[type="radio"] {
    box-sizing: border-box;
    /* 1 */
    padding: 0;
    /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
    height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */

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

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */

[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */

::-webkit-file-upload-button {
    -webkit-appearance: button;
    /* 1 */
    font: inherit;
    /* 2 */
}

/* Interactive
========================================================================== */

/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */

details {
    display: block;
}

/*
 * Add the correct display in all browsers.
 */

summary {
    display: list-item;
}

/* Misc
========================================================================== */

/**
 * Add the correct display in IE 10+.
 */

template {
    display: none;
}

/**
 * Add the correct display in IE 10.
 */

[hidden] {
    display: none;
}

/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/

body,
button,
input,
select,
optgroup,
textarea {
    font-size: 16px;
    line-height: 24px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    clear: both;
}

dfn,
cite,
em,
i {
    font-style: italic;
}

blockquote {
    margin: 0 1.5em;
}

address {
    margin: 0 0 1.5em;
}

pre {
    background: #eee;
    font-size: 15px;
    font-size: 0.9375rem;
    line-height: 1.6;
    margin-bottom: 0;
    max-width: 100%;
    /* overflow: auto; */
    padding: 1.6em;
}

code,
kbd,
tt,
var {
    font-size: 15px;
    font-size: 0.9375rem;
}

abbr,
acronym {
    border-bottom: 1px dotted #666;
    cursor: help;
}

mark,
ins {
    background: #fff9c0;
    text-decoration: none;
}

big {
    font-size: 125%;
}

/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/

html {
    box-sizing: border-box;
}

*,
*:before,
*:after {
    /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
    box-sizing: inherit;
}

hr {
    background-color: #ccc;
    border: 0;
    height: 1px;
    margin-bottom: 1.5em;
}

ul,
ol {
    margin: 0 0 1.5em 3em;
}

ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

ol {
    list-style: decimal;
}

li>ul,
li>ol {
    margin-bottom: 0;
    margin-left: 1.5em;
}

dt {
    font-weight: bold;
}

dd {
    margin: 0 1.5em 1.5em;
}

img {
    height: auto;
    /* Make sure images are scaled correctly. */
    max-width: 100%;
    /* Adhere to container width. */
}

figure {
    margin: 1em 0;
    /* Extra wide images within figure tags don't overflow the content area. */
}

table {
    margin: 0 0 1.5em;
    width: 100%;
}

/*--------------------------------------------------------------
# Forms
--------------------------------------------------------------*/

select {
    border: 1px solid #ccc;
}

textarea {
    width: 100%;
}

/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/

.main-navigation {
    clear: both;
    display: block;
    float: left;
    width: 100%;
    height: 80px;
}

.main-navigation ul {
    list-style: none;
    margin: 0;
    padding-left: 0;
}

.main-navigation ul ul {
    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.2);
    float: left;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 99999;
    background: #fff;
    transition: 0.5s;
    opacity: 0;
    transform: rotateY(90deg);
    width: 220px;
}

.main-navigation ul ul ul {
    left: -999em;
    top: 0;
}

.main-navigation li .sub-menu li {
    width: 100%;
}

.main-navigation ul ul li:hover>ul,
.main-navigation ul ul li.focus>ul {
    left: 100%;
}

.main-navigation ul ul a {
    width: auto;
}

.main-navigation ul li:hover>ul,
.main-navigation ul li.focus>ul {
    opacity: 1;
    transition: 0.5s;
    transform: rotateY(0);
    margin: 0 auto;
}

.main-navigation li {
    float: left;
    position: relative;
    margin-right: 45px;
}

.main-navigation a {
    transition: 0.3s;
    position: relative;
}

@media screen and (min-width: 992px) {
    .menu-toggle {
        display: none;
    }
}

.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation {
    margin: 0 0 1.5em;
    overflow: hidden;
}

.comment-navigation .nav-previous,
.posts-navigation .nav-previous,
.post-navigation .nav-previous {
    float: left;
    width: 50%;
}

.comment-navigation .nav-next,
.posts-navigation .nav-next,
.post-navigation .nav-next {
    float: right;
    text-align: right;
    width: 50%;
}

/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/

/* Text meant only for screen readers. */

.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute !important;
    width: 1px;
    word-wrap: normal !important;
    /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}

.screen-reader-text:focus {
    background-color: #f1f1f1;
    border-radius: 3px;
    box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
    clip: auto !important;
    clip-path: none;
    color: #21759b;
    display: block;
    font-size: 14px;
    font-size: 0.875rem;
    font-weight: bold;
    height: auto;
    left: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000;
    /* Above WP toolbar. */
}

/* Do not show the outline on the skip link target. */

#content[tabindex="-1"]:focus {
    outline: 0;
}

/*--------------------------------------------------------------
# Alignments
--------------------------------------------------------------*/

.alignleft {
    display: inline;
    float: left;
    margin-right: 1.5em;
}

.alignright {
    display: inline;
    float: right;
    margin-left: 1.5em;
}

.aligncenter {
    clear: both;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

/*--------------------------------------------------------------
# Clearings
--------------------------------------------------------------*/

.clear:before,
.clear:after,
.entry-content:before,
.entry-content:after,
.comment-content:before,
.comment-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after {
    content: "";
    display: table;
    table-layout: fixed;
}

.clear:after,
.entry-content:after,
.comment-content:after,
.site-header:after,
.site-content:after,
.site-footer:after {
    clear: both;
}

/*--------------------------------------------------------------
# Widgets
--------------------------------------------------------------*/

.widget {
    margin: 0 0 1.5em;
    /* Make sure select elements fit in widgets. */
}

.widget select {
    max-width: 100%;
}

/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/

/*--------------------------------------------------------------
## Posts and pages
--------------------------------------------------------------*/

.sticky {
    display: block;
}

.updated:not(.published) {
    display: none;
}

.page-links {
    clear: both;
    margin: 0 0 1.5em;
}

/*--------------------------------------------------------------
## Comments
--------------------------------------------------------------*/

.comment-content a {
    word-wrap: break-word;
}

.bypostauthor {
    display: block;
}

/*--------------------------------------------------------------
# Infinite scroll
--------------------------------------------------------------*/

/* Globally hidden elements when Infinite Scroll is supported and in use. */

.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
    /* Theme Footer (when set to scrolling) */
    display: none;
}

/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */

.infinity-end.neverending .site-footer {
    display: block;
}

/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/

.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
    border: none;
    margin-bottom: 0;
    margin-top: 0;
    padding: 0;
}

/* Make sure embeds and iframes fit their containers. */

embed,
iframe,
object {
    max-width: 100%;
}

/* Make sure logo link wraps around logo image. */

.custom-logo-link {
    display: inline-block;
}

.custom-logo-link img {
    width: 100%;
}

/*--------------------------------------------------------------
## Captions
--------------------------------------------------------------*/

.wp-caption {
    margin-bottom: 1.5em;
    max-width: 100%;
}

.wp-caption img[class*="wp-image-"] {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.wp-caption .wp-caption-text {
    margin: 0.8075em 0;
}

.wp-caption-text {
    text-align: center;
}

/*========== Fonts Start ==========*/

@font-face {
    font-family: "Raleway";
    src: url("assets/fonts/Raleway-Regular.eot");
    src: url("assets/fonts/Raleway-Regular.eot?#iefix") format("embedded-opentype"),
        url("assets/fonts/Raleway-Regular.woff2") format("woff2"),
        url("assets/fonts/Raleway-Regular.woff") format("woff"),
        url("assets/fonts/Raleway-Regular.ttf") format("truetype"),
        url("assets/fonts/Raleway-Regular.svg#Raleway-Regular") format("svg");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Raleway";
    src: url("assets/fonts/Raleway-Bold.eot");
    src: url("assets/fonts/Raleway-Bold.eot?#iefix") format("embedded-opentype"),
        url("assets/fonts/Raleway-Bold.woff2") format("woff2"),
        url("assets/fonts/Raleway-Bold.woff") format("woff"),
        url("assets/fonts/Raleway-Bold.ttf") format("truetype"),
        url("assets/fonts/Raleway-Bold.svg#Raleway-Bold") format("svg");
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Raleway";
    src: url("assets/fonts/Raleway-Black.eot");
    src: url("assets/fonts/Raleway-Black.eot?#iefix") format("embedded-opentype"),
        url("assets/fonts/Raleway-Black.woff2") format("woff2"),
        url("assets/fonts/Raleway-Black.woff") format("woff"),
        url("assets/fonts/Raleway-Black.ttf") format("truetype");
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Raleway";
    src: url("assets/fonts/Raleway-SemiBold.eot");
    src: url("assets/fonts/Raleway-SemiBold.eot?#iefix") format("embedded-opentype"),
        url("assets/fonts/Raleway-SemiBold.woff2") format("woff2"),
        url("assets/fonts/Raleway-SemiBold.woff") format("woff"),
        url("assets/fonts/Raleway-SemiBold.ttf") format("truetype");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

/*========== Fonts End ==========*/

/*========== Common CSS Start ==========*/

body {
    font-size: 16px;
    line-height: 28px;
    color: #3e3e3e;
    font-family: "Raleway";
}

p {
    font-size: 16px;
    line-height: 28px;
    margin-bottom: 12px;
}

p a,
span a,
.entry-content a:not(.sec-btn) {
    color: var(--purple);
    transition: 0.3s;
}

p a:hover,
span a:hover {
    color: #3e3e3e;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 700;
    color: #3e3e3e;
}

.h1-title {
    font-size: 48px;
    line-height: 56px;
    color: var(--dark-gray);
    text-transform: capitalize;
    margin-bottom: 0;
    font-family: "Raleway";
    font-weight: bold;
}

.sec-color {
    color: var(--purple);
    font-weight: 900;
}

.h2-title {
    font-size: 40px;
    line-height: 46px;
    color: var(--dark-gray);
    margin-bottom: 5px;
    text-transform: capitalize;
    font-family: "Raleway";
}

.overflow-text {
    max-height: 300px;
    height: 120px;
    overflow: auto;
    overflow-x: hidden;
    padding-right: 10px;
}

.overflow-text p:last-child {
    margin-bottom: 0;
}

::-webkit-scrollbar {
    width: 3px;
}

::-webkit-scrollbar-thumb {
    background: var(--purple);
}

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

.overflow-text::-webkit-scrollbar {
    width: 2px;
}

.overflow-text::-webkit-scrollbar-thumb {
    background: var(--purple);
}

.overflow-text::-webkit-scrollbar-track {
    background: #dddddd;
}

.for-des {
    display: block !important;
}

.for-mob {
    display: none !important;
}

.product-updates .wpcf7-spinner {
    position: absolute;
}

.wpcf7-response-output.wpcf7-display-none.wpcf7-validation-errors,
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output {
    margin: 2em 0 1em;
    padding: 0.2em 1em;
    border: 2px solid #ff0000;
    color: #ff0000;
}

.grecaptcha-badge {
    display: none !important;
}

select {
    -moz-appearance: none;
    -webkit-appearance: none;
}

.form-element {
    position: relative;
}

.form-element i {
    position: absolute;
    top: 17px;
    right: 20px;
    pointer-events: none;
    font-size: 20px;
    color: var(--purple);
}

div.wpcf7-mail-sent-ok {
    display: none !important;
}

.sec-wp {
    position: relative;
    z-index: 4;
}

span.wpcf7-not-valid-tip {
    position: absolute;
    bottom: -30px;
    left: 20px;
    color: #fff;
}

.wpcf7-form.invalid .form-input.wpcf7-not-valid {
    border: 2px solid red;
}

.wpcf7-form-control-wrap.your-message {
    margin-bottom: 22px;
}

.contact-us-form .wpcf7-form-control-wrap,
.wpcf7-form-control-wrap {
    display: block;
    margin-bottom: 30px;
    position: relative;
}

.screen-reader-response {
    display: none;
}

.wpcf7-response-output.wpcf7-validation-errors {
    margin: 2em 0 1em;
    padding: 0.2em 1em;
    border: 2px solid #ff0000;
    color: #ff0000;
}

.form-input::-webkit-input-placeholder {
    color: var(--dark-gray);
    opacity: 1;
}

.form-input::-moz-placeholder {
    color: var(--dark-gray);
    opacity: 1;
}

.form-input:-ms-input-placeholder {
    color: var(--dark-gray);
    opacity: 1;
}

.form-input::-ms-input-placeholder {
    color: var(--dark-gray);
    opacity: 1;
}

.form-input::placeholder {
    color: var(--dark-gray);
    opacity: 1;
}

select option {
    color: #000;
}

select {
    color: #000000;
}

select::-ms-expand {
    display: none;
}

.form-input {
    width: 100%;
    height: 50px;
    border: none;
    outline: none !important;
    padding: 10px 34px;
    color: var(--dark-gray);
    background: #ffffff;
    -webkit-appearance: none;
    border-radius: 30px;
}

.form-input.wpcf7-textarea {
    height: 218px;
    resize: none;
    padding: 20px 34px;
}

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

input[type="number"].form-input {
    -moz-appearance: textfield;
}

span.ajax-loader {
    top: 8px;
}

.submit-btn {
    text-align: right;
}

.main-banner .banner-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.video-section {
    padding-top: 69px;
    text-align: center;
}

.video-section .line {
    margin: 20px auto !important;
}

.form-input[type="radio"] {
    position: absolute;
    top: 0;
    left: 0;
    width: 30px;
    height: 30px;
    background: 0 0;
    border: none;
    outline: none;
    opacity: 0;
    z-index: 5;
}

span.wpcf7-list-item-label {
    padding-left: 30px;
}

span.wpcf7-list-item-label:before,
span.wpcf7-list-item-label:after {
    content: " ";
}

span.wpcf7-list-item-label:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(0, -50%);
    width: 20px;
    height: 20px;
    border-radius: 20px;
    border: 2px solid #39b449;
    z-index: 1;
}

span.wpcf7-list-item-label:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 4px;
    transform: translate(0, -50%);
    width: 12px;
    height: 12px;
    border-radius: 15px;
    background: #39b449;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    opacity: 0;
    transition: 0.3s;
    z-index: 0;
}

.form-input[type="radio"]:checked~span.wpcf7-list-item-label:after {
    opacity: 1;
}

span.wpcf7-list-item {
    position: relative;
}

.compensate-for-scrollbar {
    margin-right: 0 !important;
}

.slick-initialized .slick-slide {
    outline: none !important;
}

.modal-body.overflow-text {
    max-height: 90vh;
    padding: 60px 30px 30px;
    height: auto;
}

.modal-dialog {
    margin: 0 auto;
    height: 100%;
    display: flex;
    align-items: center;
}

.modal-body.overflow-text .sec-btn:hover {
    border-color: #fff;
}

.modal-open .modal,
.modal-open {
    padding-right: 0 !important;
}

.modal-open {
    position: fixed;
    width: 100%;
}

#sb_instagram #sbi_images .sbi_item.sbi_transition {
    opacity: 1 !important;
    max-height: unset !important;
}

.back-img {
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.sec-btn {
    width: auto;
    height: 46px;
    background: var(--purple);
    border: none;
    outline: none !important;
    border-radius: 40px;
    color: #ffffff;
    text-align: center;
    text-transform: capitalize;
    padding: 8px 30px;
    border: 2px solid var(--purple);
    transition: 0.3s;
    font-weight: bold;
    box-shadow: 0px 5px 10px rgb(0 0 0 / 15%);
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

.sec-btn:hover {
    background: var(--dark-gray);
    color: #ffffff;
    border-color: var(--dark-gray);
}

.sec-btn.hover-white:hover {
    background: #ffffff;
    color: #008ce9;
}

.transparent-btn {
    background-color: transparent;
    color: var(--dark-gray);
    border-color: var(--dark-gray);
}

.transparent-btn svg {
    stroke: #333;
}

.transparent-btn:hover svg {
    stroke: #fff;
}

.price-gcl {
    margin-top: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.price-gcl .price-title {
    color: var(--dark-gray);
}

.price-gcl h6 {
    font-size: 30px;
    color: var(--purple);
    font-weight: bold;
    margin-bottom: 0;
    display: inline-flex;
    align-items: center;
}

.price-gcl h6 span {
    font-size: 27px;
}

.price-gcl h6 span:last-child {
    color: var(--dark-gray);
    font-weight: normal;
    font-size: 18px;
    margin-left: 6px;
}

.plugin-details .plan-validity {
    margin: 0 !important;
    font-size: 14px;
    font-weight: normal;
}

.price-title {
    color: var(--dark-gray);
    margin-right: 10px;
    line-height: initial;
    font-size: 22px;
}

.sub-title {
    font-size: 20px;
    line-height: 30px;
    color: #333740;
    display: block;
    margin-bottom: 0;
}

.centered-text {
    text-align: center;
}

.slick-dots li button:before,
.slick-dots li button:hover:before,
.slick-dots li button:focus:before,
.slick-dots li.slick-active button:before {
    display: none;
}

.slick-dots li {
    width: auto;
    height: auto;
    margin: 0;
}

.slick-dots li button {
    padding: 0;
    width: 12px;
    height: 6px;
    background: #333;
    margin: 0 6px;
    transition: 0.3s;
    border-radius: 30px;
}

.slick-dots li button:hover {
    background: var(--purple);
}

.slick-dots li.slick-active button {
    width: 35px;
    background: var(--purple);
}

.slick-dots {
    bottom: -53px;
    z-index: 5;
    font-size: 0;
    line-height: 1;
}

.modal-content {
    border: none;
    border-radius: 0;
    background: #333740;
}

button.close {
    position: absolute;
    top: 0;
    right: 0;
    width: 40px;
    height: 40px;
    background: #6ba229;
    opacity: 1 !important;
    text-shadow: none;
    z-index: 2;
    color: #fff;
    transition: 0.3s;
    border-radius: 0;
    outline: none !important;
    font-size: 20px;
}

.modal-body button.close {
    background: var(--purple);
}

.modal-body .h2-title {
    color: #fff;
    margin-bottom: 20px;
    font-size: 24px;
    line-height: 34px;
    padding-right: 40px;
}

.wpcf7 form.sent .wpcf7-response-output {
    color: #46b450;
}

.sec-btn.hover-white.email-btn {
    width: 250px;
    margin-left: 11px;
}

.sec-btn svg,
.donate .sec-btn.min-btn i,
.sec-btn i {
    margin-left: 10px;
}

.main-banner .sec-btn {
    margin-top: 29px;
}

.line {
    position: relative;
    text-align: center;
    height: 5px;
    width: 200px;
    background: var(--purple);
    margin: 15px auto;
    border-radius: 10px;
}

.line:before {
    content: "";
    display: block;
    position: absolute;
    height: 20px;
    width: 20px;
    background: #fff;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
    box-shadow: 0 3px 6px rgb(0 0 0 / 0.16);
    z-index: 1;
}

.line:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    width: 100px;
    height: 5px;
    background: var(--dark-gray);
    border-radius: 10px;
}

.wordpress-plugin .banner-img,
.single-plugin .banner-img {
    width: 100%;
    height: auto;
    max-width: unset;
    max-height: unset;
}

.for-des {
    display: block;
}

.for-mob {
    display: none;
}

/* Blog CSS Start */

.posted-on a,
.byline a,
.widget ul li a,
.entry-title a,
.logged-in-as a,
.comment-body a,
.nav-previous a,
.nav-next a {
    transition: 0.3s;
    color: var(--purple);
}

.entry-title,
.widget-title {
    font-size: 30px;
    text-transform: uppercase;
    color: var(--dark-gray);
    margin-bottom: 20px;
}

.widget_search .widget-title {
    display: none;
}

.submit-btn {
    text-align: left;
}

.type-post {
    margin-bottom: 30px;
}

.widget ul li {
    padding-left: 20px;
    position: relative;
}

.widget ul li:before {
    content: "";
    display: block;
    position: absolute;
    top: 45%;
    left: 10px;
    transform: translate(-50%, -50%);
    height: 6px;
    width: 6px;
    background: var(--dark-gray);
    border-radius: 10px;
}

.entry-title a:hover,
.posted-on a:hover,
.byline a:hover,
.widget ul li a:hover,
.comment-body a:hover,
.nav-previous a:hover,
.nav-next a:hover {
    text-decoration: underline !important;
    color: var(--dark-gray);
}

.widget-area .widget_search .search-form label,
.page-content .search-form label {
    width: calc(100% - 74px);
    margin-bottom: 0;
    border-radius: 0;
    box-shadow: none;
}

.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute !important;
    width: 1px;
    word-wrap: normal !important;
}

.widget-area .widget_search .search-form .search-field,
.page-content .search-form .search-field {
    background: #fff;
    font-size: 16px;
    outline: none;
    width: 100%;
    height: 50px;
    margin: 0;
    border-radius: 0;
    border: 1px solid var(--dark-gray);
    padding: 13px 20px 12px;
}

.widget-area .widget_search .search-form .search-submit,
.page-content .search-form .search-submit {
    padding: 10px 16px;
    font-size: 15px;
    font-weight: 700;
    border-radius: 0;
    width: 25%;
    height: 50px;
    color: #fff;
    position: absolute;
    bottom: 0;
    top: 0;
    right: 0;
    transform: translate(0);
    outline: none;
    border: none;
    cursor: pointer;
    background: var(--purple);
    transition: 0.3s;
}

.widget-area .widget_search .search-form .search-submit:hover,
.page-content .search-form .search-submit:hover {
    background: var(--dark-gray);
    color: #ffffff;
}

form.search-form {
    width: 100%;
    margin: 0;
    position: relative;
}

.comments-area p input,
.comments-area textarea {
    border-radius: 40px;
    height: 46px;
    width: 100%;
    outline: none;
    box-shadow: 0 0 20px rgb(0 0 0 / 6%);
    padding: 15px;
    background: #ffffff;
    border: 1px solid var(--dark-gray);
}

.comment-form-comment textarea {
    outline: none !important;
    resize: none;
    padding: 18px;
    height: 180px;
    border-radius: 10px;
}

.form-submit .submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 200px;
    height: 50px;
    background: var(--purple);
    color: #fff;
    font-size: 16px;
    letter-spacing: 1px;
    border: 1px solid var(--purple);
    position: relative;
    transition: 0.5s;
    box-shadow: none;
    outline: none !important;
    border-radius: 40px;
    padding: 13px;
    transition: 0.3s;
}

.form-submit .submit:hover {
    background: var(--dark-gray);
    border-color: var(--dark-gray);
    color: #ffffff;
}

.comments-area p.comment-form-cookies-consent {
    position: relative;
    padding-left: 20px;
}

.comments-area p.comment-form-cookies-consent input {
    width: auto;
    height: auto;
    border-radius: 0;
    box-shadow: none;
    padding: 0;
    background: transparent;
    position: absolute;
    top: 4px;
    left: 0;
}

.comment-list {
    margin-left: 0;
}

.status-publish footer.entry-footer {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    gap: 10px;
}

nav.navigation.posts-navigation {
    margin-top: 30px;
}

.product a.post-thumbnail {
    margin-bottom: 20px;
    display: block;
}

.entry-meta {
    margin: 15px 0;
}

.entry-content a:not(.sec-btn):hover {
    color: var(--dark-gray);
    text-decoration: underline !important;
}

.entry-content ul li {
    margin-bottom: 15px;
}

.entry-content li {
    position: relative;
    padding-left: 15px;
    margin-bottom: 5px;
}

.entry-content li:before {
    content: "";
    display: block;
    position: absolute;
    top: 9px;
    left: 0;
    height: 7px;
    width: 7px;
    border-radius: 7px;
    background-color: var(--purple);
}

.entry-content ul {
    margin-bottom: 15px;
    padding-left: 15px;
}

.post-thumbnail,
.entry-content img {
    border-radius: 20px;
    overflow: hidden;
}

.entry-content img {
    box-shadow: 0 3px 6px rgb(0 0 0 / 16%);
    margin-bottom: 20px;
}

.entry-content h2 {
    margin: 20px 0;
}

.entry-content h3 {
    margin: 25px 0 15px;
}

.type-post p {
    font-size: 18px;
    line-height: 34px;
}

.type-post a:not(.sec-btn) {
    font-weight: 600;
    text-decoration: underline !important;
}

/* Blog CSS End */

.container {
    position: relative;
    z-index: 5;
}

/*========== Common CSS End ==========*/

/*========== Header Start ==========*/

.site-header {
    transition: 0.3s;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 80px;
    background: var(--white-color);
    z-index: 100;
}

.site-branding {
    width: 100%;
    height: 80px;
    position: relative;
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    transition: 0.3s;
}

.site-branding a {
    width: 100%;
    display: inline-block;
}

.header-menu-box {
    text-align: right;
    position: relative;
}

.main-navigation {
    float: none;
    width: auto;
    display: inline-block;
    vertical-align: middle;
}

.main-navigation li {
    margin-right: 15px;
    text-align: left;
}

.main-navigation li:last-child {
    margin-right: 0;
}

.main-navigation li a {
    font-size: 16px;
    font-weight: bold;
    line-height: 20px;
    color: var(--dark-gray);
    display: block;
    padding: 30px 20px;
    position: relative;
    transition: 0.5s;
}

.header-right {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    vertical-align: middle;
    margin-left: 20px;
}

.search-icon {
    color: var(--dark-gray);
    font-size: 20px;
    transition: 0.5s;
}

.login.sec-btn {
    width: 130px;
    height: 35px;
    display: inline-flex;
    padding: 4px 5px;
    margin-left: 15px;
    border-radius: 40px;
}

.search-icon:hover {
    color: var(--purple);
    transition: 0.5s;
}

.main-navigation li a:before {
    content: "";
    display: block;
    height: 0;
    width: 100%;
    background: rgb(51 51 51 / 0.03);
    position: absolute;
    top: 0;
    left: 0;
    transition: 0.5s;
}

.main-navigation li a:hover:before,
.main-navigation li.current-menu-item>a:before,
.main-navigation li.current-menu-parent>a:before,
.tax-html-themes-cat .main-navigation li.menu-item-1594>a:before,
.tax-html-themes-cat .main-navigation li.menu-item-1593>a:before,
.tax-graphic-templates-cat .main-navigation li.menu-item-1595>a:before,
.tax-graphic-templates-cat .main-navigation li.menu-item-1593>a:before {
    height: 100%;
    transition: 0.5s;
}

.main-navigation li a:after {
    content: "";
    position: absolute;
    display: block;
    bottom: 0;
    left: 0;
    height: 100%;
    background: var(--purple);
    width: 100%;
    opacity: 0;
    transition: 0.5s;
}

.main-navigation li a:hover:after,
.main-navigation li.current-menu-item>a:after,
.main-navigation li.current-menu-parent>a:after,
.tax-html-themes-cat .main-navigation li.menu-item-1594>a:after,
.tax-html-themes-cat .main-navigation li.menu-item-1593>a:after,
.tax-graphic-templates-cat .main-navigation li.menu-item-1595>a:after,
.tax-graphic-templates-cat .main-navigation li.menu-item-1593>a:after {
    height: 2px;
    transition: 0.5s;
    opacity: 1;
}

.main-navigation li a:hover,
.main-navigation li.current-menu-item>a,
.main-navigation li.current-menu-parent>a,
.tax-html-themes-cat .main-navigation li.menu-item-1594>a,
.tax-html-themes-cat .main-navigation li.menu-item-1593>a,
.tax-graphic-templates-cat .main-navigation li.menu-item-1595>a,
.tax-graphic-templates-cat .main-navigation li.menu-item-1593>a {
    color: var(--purple);
    transition: 0.5s;
}

.main-navigation ul>li.menu-item-has-children:after {
    content: "\f078";
    position: absolute;
    top: 50%;
    right: 5px;
    transform: translate(0, -47%) rotate(0deg);
    font-size: 12px;
    color: var(--dark-gray);
    z-index: 2;
    transition: 0.3s;
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
}

.main-navigation ul>li.current-menu-item:after,
.main-navigation ul>li.current-menu-parent:after,
.tax-html-themes-cat .main-navigation ul>li.menu-item-1593:after,
.tax-graphic-templates-cat .main-navigation ul>li.menu-item-1593:after {
    color: var(--purple);
}

.main-navigation ul>li.menu-item-has-children:hover:after {
    color: var(--purple);
    transform: translate(0, -50%) rotate(180deg);
    transition: 0.5s;
}

ul.sub-menu a {
    padding: 15px !important;
}

.site-header.sticky_head {
    box-shadow: 0 3px 6px rgb(0 0 0 / 0.16);
    transition: 0.3s;
    height: 60px;
    z-index: 99;
    background: #fff;
}

.sticky_head .site-branding {
    height: 60px;
    transition: 0.3s;
}

.sticky_head .main-navigation {
    height: 60px;
    transition: 0.3s;
}

.sticky_head .main-navigation li a {
    padding: 20px;
    transition: 0.5s;
}

a.login {
    width: 30px;
    height: 30px;
    background: var(--purple);
    border-radius: 50%;
    transition: 0.3s;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 15px;
}

.header-right a.login svg path {
    fill: #ffffff;
    transition: 0.3s;
}

.header-right a.login:hover {
    background: var(--dark-gray);
}

.header-cart {
    margin-left: 15px;
    position: relative;
}

.cart-item-number {
    position: absolute;
    top: -10px;
    right: -8px;
    width: 18px;
    height: 18px;
    font-size: 11px;
    background: #ff2700;
    border-radius: 50%;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    color: #fff;
}

.cart-item-number b {
    font-weight: normal;
    margin-top: -1px;
}

.header-cart svg path,
.header-cart svg circle {
    fill: var(--dark-gray);
    transition: 0.3s;
}

.header-cart:hover svg path,
.header-cart:hover svg circle {
    fill: var(--purple);
}

.login.sec-btn svg {
    margin: 0;
}

/*========== Header End ==========*/

/*========== Main-banner start ==========*/

.main-banner {
    position: relative;
    padding: 170px 0 185px 0;
    box-shadow: inset 0 0 10px rgb(0 0 0 / 30%);
    overflow: hidden;
}

.main-banner:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--white-color);
    opacity: 0.5;
    z-index: 0;
}

.banner-bg-icons {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: transparent;
    pointer-events: none;
    opacity: 0.3;
    z-index: 1;
    display: none;
}

.banner-bg-icons .icon {
    position: absolute;
    display: block;
}

.banner-bg-icons .icon img {
    width: auto;
    max-width: 100%;
    height: auto;
}

.banner-bg-icons .icon.one {
    top: 80px;
    left: -10px;
    width: 80px;
    -webkit-animation: movedelement 5s linear infinite;
    animation: movedelement 5s linear infinite;
}

.banner-bg-icons .icon.two {
    top: 55%;
    left: 15%;
    width: 60px;
    -webkit-animation: movedelement2 10s linear infinite;
    animation: movedelement2 10s linear infinite;
}

.banner-bg-icons .icon.three {
    bottom: 20px;
    left: 3%;
    width: 70px;
    -webkit-animation: movedelement3 8s linear infinite;
    animation: movedelement3 8s linear infinite;
}

.banner-bg-icons .icon.four {
    top: 100px;
    right: 15%;
    width: 60px;
    -webkit-animation: movedelement2 10s linear infinite;
    animation: movedelement2 10s linear infinite;
}

.banner-bg-icons .icon.five {
    top: 55%;
    right: 10px;
    width: 70px;
    -webkit-animation: movedelement3 8s linear infinite;
    animation: movedelement3 8s linear infinite;
}

.banner-bg-icons .icon.six {
    bottom: 30px;
    right: 15%;
    width: 60px;
    -webkit-animation: movedelement 5s linear infinite;
    animation: movedelement 5s linear infinite;
}

@keyframes movedelement {
    0% {
        -webkit-transform: translate(0);
        transform: translate(0);
    }

    25% {
        -webkit-transform: translate(10px, 10px);
        transform: translate(10px, 10px);
    }

    50% {
        -webkit-transform: translate(5px, 5px);
        transform: translate(5px, 5px);
    }

    75% {
        -webkit-transform: translate(10px, -5px);
        transform: translate(10px, -5px);
    }

    to {
        -webkit-transform: translate(0);
        transform: translate(0);
    }
}

@keyframes movedelement2 {
    0% {
        -webkit-transform: translate(0);
        transform: translate(0);
    }

    25% {
        -webkit-transform: translate(-10px, -10px);
        transform: translate(-10px, -10px);
    }

    50% {
        -webkit-transform: translate(-5px, -5px);
        transform: translate(-5px, -5px);
    }

    75% {
        -webkit-transform: translate(-10px, 5px);
        transform: translate(-10px, 5px);
    }

    to {
        -webkit-transform: translate(0);
        transform: translate(0);
    }
}

@keyframes movedelement3 {
    0% {
        -webkit-transform: translate(0);
        transform: translate(0);
    }

    25% {
        -webkit-transform: translate(15px, 15px);
        transform: translate(15px, 15px);
    }

    50% {
        -webkit-transform: translate(8px, 8px);
        transform: translate(8px, 8px);
    }

    75% {
        -webkit-transform: translate(15px, -8px);
        transform: translate(15px, -8px);
    }

    to {
        -webkit-transform: translate(0);
        transform: translate(0);
    }
}

.banner-img {
    float: right;
    width: 50vw;
    max-width: 935px;
    height: auto;
    max-height: 815px;
}

.banner-content {
    text-align: center;
}

.banner-content .h1-title,
.banner-content p {
    color: var(--dark-gray);
}

.banner-content-text {
    margin-top: 23px;
}

.banner-content-text p:last-child {
    margin-bottom: 0;
}

.banner-content .sec-btn:hover {
    background: var(--white-color);
    border-color: var(--white-color);
    color: var(--purple);
}

.banner-content .sec-btn svg {
    transition: 0.3s;
}

.banner-content .sec-btn:hover svg {
    stroke: var(--purple);
}

.btn-wp form.cart .sec-btn:hover svg path {
    fill: var(--purple);
}

.about-theme-content .btn-wp form.cart .sec-btn {
    border: 2px solid var(--dark-gray);
    background: var(--white-color);
    color: var(--dark-gray);
}

.about-theme-content .btn-wp form.cart .sec-btn:hover {
    border: 2px solid var(--dark-gray);
    background: var(--dark-gray);
    color: var(--white-color);
}

.about-theme-content .btn-wp form.cart .sec-btn svg path {
    fill: var(--dark-gray);
}

.about-theme-content .btn-wp form.cart .sec-btn:hover svg path {
    fill: var(--white-color);
}

/*========== Main-banner End ==========*/

/*========== search-items start ==========*/

.main-banner.search-banner {
    padding: 200px 0px 150px;
}

.main-banner.search-banner .h1-title {
    text-align: center;
}

.search-items {
    position: relative;
    margin: -85px 0;
    z-index: 1;
}

.search-form-box {
    position: relative;
    background: var(--white-color);
    box-shadow: 0px 20px 40px rgb(0 0 0 / 10%);
    border-radius: 10px;
    padding: 30px 30px 40px 30px;
    height: 170px;
    text-align: center;
}

.search-section {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    margin-top: 20px;
    width: 750px;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}

.search-input span.search-icon {
    color: #fff;
    height: 46px;
    width: 46px;
    background: var(--purple);
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    border-radius: 40px;
}

.search-input {
    position: relative;
    padding-left: 20px;
}

.search-input span.search-icon .fa {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.search-input .search-error {
    display: none;
}

.search-section .form-input {
    height: 46px;
    width: 400px;
    max-width: 100%;
    padding: 0px 42px;
    color: var(--dark-gray);
    background: #f7f6f7;
    opacity: 1;
    border-radius: 0;
}

.search-select.form-element i {
    position: absolute;
    top: 10px;
    right: 15px;
    pointer-events: none;
    color: var(--dark-gray);
    font-size: 20px;
}

.search-select.form-element .form-input {
    width: 200px;
    border-left: 1px solid rgb(0 0 0 / 0.2);
    padding: 0px 14px;
    background: #f7f6f7;
    border-radius: 0;
}

.search-section .sec-btn {
    width: 130px;
    border-radius: 0px 40px 40px 0px;
    background: var(--purple);
}

.search-section .sec-btn:hover {
    background: var(--dark-gray);
    border-color: var(--dark-gray);
    color: var(--white-color);
}

/*========== search-items End ==========*/

/*========== wp-plugins Start ==========*/

.pt-for-search {
    padding-top: 158px !important;
}

.wp-plugins {
    padding: 92px 0px 100px;
    background: rgb(222 232 255 / 0.2);
}

.post-type-archive-wordpress-plugins .inner-page-text {
    background: rgb(222 232 255 / 0.2);
}

.wp-plugins .title p {
    color: #3e3e3e;
    margin-top: 25px;
    margin-bottom: 12px;
}

.plugin-box {
    background: #fff;
    border-radius: 10px;
    padding: 35px 30px;
    box-shadow: 1px 1px 0 rgb(0 0 0 / 5%);
    border: 2px solid transparent;
    position: relative;
    top: 0;
    transition: 0.4s;
    margin-top: 93px;
}

.plugin-box:hover {
    position: relative;
    top: -10px;
    box-shadow: 0px 20px 40px rgb(0 0 0 / 10%);
    border: 2px solid var(--purple);
    transition: 0.4s;
}

.plugin-icon {
    position: absolute;
    top: -60px;
    left: 50%;
    width: 120px;
    height: 120px;
    background: #fff;
    transform: translate(-50%, 0%);
    border-radius: 100%;
    box-shadow: 0 3px 6px rgb(0 0 0 / 0.15);
    border: 2px solid transparent;
    transition: 0.4s;
    overflow: hidden;
}

.plugin-icon img {
    width: 70px;
    height: 70px;
    position: absolute;
    top: 50%;
    left: 50%;
    border-radius: 5px;
    transform: translate(-50%, -50%);
    box-shadow: 0 3px 6px rgb(0 0 0 / 0.15);
}

.plugin-icon svg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 55.78px;
    display: none;
}

/*
.plugin-icon svg path {
    fill: var(--purple);
    transition: 0.4s;
}

.plugin-box:hover .plugin-icon svg path {
    fill: #fff;
    transition: 0.4s;
}
 */

.plugin-box .overflow-text {
    overflow: hidden;
    padding: 0;
    max-width: unset;
    height: 105px;
    margin-bottom: 0px;
}

.plugin-box .overflow-text p {
    display: -webkit-box;
    width: 100%;
    -webkit-box-orient: vertical;
    overflow: hidden;
    -webkit-line-clamp: 4;
    margin-bottom: 0;
}

.plugin-box .sec-btn:hover {
    background: var(--purple);
    color: #ffffff;
}

.plugin-box:hover .plugin-icon {
    border: 2px solid var(--purple);
    transition: 0.4s;
}

.plugin-box h4 {
    font-size: 25px;
    line-height: 30px;
    color: var(--dark-gray);
    margin: 50px 0px 24px;
    font-weight: bold;
    height: 60px;
    display: -webkit-box;
    width: 100%;
    -webkit-box-orient: vertical;
    overflow: hidden;
    -webkit-line-clamp: 2;
}

.plugin-box h4 a {
    color: var(--dark-gray);
    transition: 0.3s;
}

.plugin-box h4 a:hover {
    color: var(--purple);
}

.plugin-box p {
    color: var(--dark-gray);
    /* white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin: 0; */
    margin-bottom: 10px;
}

.plugin-box .star-rating {
    margin: 0;
    margin-bottom: 20px;
}

.plugin-box .sec-btn {
    margin-top: 23px;
    background: #ffffff;
    color: var(--purple);
}

.plugin-box .sec-btn:hover {
    background: var(--purple);
    border-color: var(--purple);
    color: #ffffff;
}

.plugin-box .sec-btn svg path {
    fill: var(--purple);
    transition: 0.4s;
}

.plugin-box .sec-btn:hover svg path {
    fill: #ffffff;
    transition: 0.4s;
}

.sec-btn.view-more {
    background: var(--dark-gray);
    border-color: var(--dark-gray);
    margin-top: 60px;
}

.sec-btn.view-more:hover {
    background: var(--purple);
    border-color: var(--purple);
}

/*========== wp-plugins End ==========*/

/*========== Themes Start ==========*/

.themes {
    position: relative;
    padding-bottom: 100px;
}

.theme-overview {
    margin-bottom: -30px;
}

.theme-overview.graphic-template-overview {
    margin-bottom: 70px;
}

.theme-title {
    display: inline-block;
    padding: 10px 30px;
    min-height: 60px;
    margin: 0 auto;
    background: var(--purple);
    border-radius: 0 0 15px 15px;
    margin-bottom: 50px;
}

.theme-title .h2-title {
    font-size: 30px;
    line-height: 40px;
    color: #ffffff;
    margin-bottom: 0;
}

.themes-part .line {
    margin: 17px 0 46px;
}

.themes-part .overflow-text {
    height: 155px;
    padding-right: 0;
    overflow: hidden;
    margin-bottom: 36px;
}

.sec-btn.visit-page {
    background: var(--dark-gray);
    border-color: var(--dark-gray);
}

.sec-btn.visit-page:hover {
    background: var(--purple);
    border-color: var(--purple);
}

.themes-part .overflow-text p {
    line-height: 26px;
    display: -webkit-box;
    width: 100%;
    -webkit-box-orient: vertical;
    overflow: hidden;
    -webkit-line-clamp: 6;
}

.themes-part .row {
    margin-bottom: 100px;
}

.themes-part .row:last-child {
    margin-bottom: 0;
}

h2.h2-title.theme-overview-title {
    font-size: 30px;
    margin-bottom: 17px;
}

/*========== Themes End ==========*/

/*========== textimonial Start ==========*/

/*section.textimonial .line:after {
    display: none;
}*/

.textimonial {
    padding: 92px 0px 216px;
    background-attachment: fixed;
}

.testimonial-box {
    background: #fff;
    padding: 86px 38px 74px;
    border-radius: 20px;
    box-shadow: 0 0 20px rgb(0 0 0 / 0.15);
    margin-top: 72px;
    position: relative;
    margin: 0px 20px;
}

.client-name {
    font-size: 20px;
    line-height: 26px;
    color: var(--dark-gray);
    margin: 30px 0px 3px;
    text-transform: capitalize;
}

.designation {
    font-size: 14px;
    line-height: 26px;
    color: var(--purple);
    text-transform: capitalize;
}

.testimonial-box:before,
.testimonial-box:after {
    content: "";
    position: absolute;
    top: 36px;
    left: 33px;
    font-size: 22px;
    z-index: 2;
    background-image: url(assets/images/quotemarks.png);
    transition: 0.3s;
    height: 35.29px;
    width: 50px;
    background-size: cover;
}

.testimonial-box:after {
    top: unset;
    right: 26px;
    left: auto;
    bottom: 25px;
    transform: rotate(180deg);
}

.testimonials-slider.slick-dotted.slick-slider {
    margin: 61px 0 30px;
}

.testimonials-slider .slick-list {
    padding: 20px 0;
    margin: -20px 0;
}

.testimonials-slider .slick-dots {
    bottom: -30px;
}

/*========== textimonial End ==========*/

/*========== Footer Start ==========*/

.site-footer {
    background: var(--dark-gray);
    padding-bottom: 70px;
}

.product-updates {
    background: var(--purple);
    height: 200px;
    border-radius: 20px;
    padding: 32px 0px 40px;
    position: relative;
    margin-top: -105px;
}

.product-updates .wpcf7 form .wpcf7-response-output {
    background-color: var(--white-color);
    margin-top: 0.5em;
}

.wpcf7-form p {
    position: relative;
    margin-bottom: 0;
}

.search-form {
    position: relative;
    width: 470px;
    margin: 24px auto 0px;
}

.search-form .wpcf7-form {
    border: none;
    overflow: visible;
}

.search-form label {
    width: 100%;
    box-shadow: 0 5px 10px rgb(0 0 0 / 0.15);
    border-radius: 40px;
}

.search-form span.wpcf7-form-control-wrap.your-email {
    margin: 0;
}

.product-updates .wpcf7-form-control-wrap {
    margin-bottom: 0;
}

.search-form .search-field {
    background: #fff;
    font-size: 16px;
    border: 0px;
    outline: none;
    width: 100%;
    height: 50px;
    color: #3e3e3e;
    border-radius: 40px;
    padding: 15px 0px 12px 30px;
    margin-top: 8px;
}

.product-updates .search-form .search-field,
.product-updates .search-form label {
    margin: 0;
}

.search-form .search-submit {
    border-radius: 30px;
    height: 44px;
    width: 46px;
    background: var(--dark-gray);
    position: absolute;
    right: -20px;
    top: 50%;
    border: 0;
    outline: none;
    transform: translate(-50%, -50%);
    padding: 0px;
    transition: 0.4s;
    color: #fff;
    font-size: 17px;
}

.search-form .search-submit:hover {
    background: var(--purple);
}

.search-form .search-submit:hover svg path {
    fill: #ffffff;
}

.search-form .ajax-loader {
    position: absolute;
    top: 21px;
    right: auto;
    margin-left: 15px;
}

.product-updates .h2-title {
    color: #fff;
}

.footer-logo {
    margin-top: 80px;
}

.footer-logo a {
    display: inline-block;
    width: 150px;
    height: 150px;
}

.footer-menu ul>li.menu-item-has-children:after {
    content: "";
    position: absolute;
    top: 50%;
    right: 3px;
    transform: translate(0, -50%);
    font-size: 22px;
    z-index: 2;
    background-image: url(assets/images/white-down-arrow.png);
    transition: 0.3s;
    height: 4px;
    width: 11px;
    background-repeat: no-repeat;
    background-size: contain;
}

.copyright-left-text p,
.copyright-right-text p {
    font-size: 13px;
    margin: 0;
    line-height: 23px;
    color: #fff;
}

.footer-bottom-link {
    text-align: center;
    margin-top: 9px;
}

.footer-bottom-link ul {
    font-size: 0;
}

.footer-bottom-link li {
    list-style: none;
    padding: 0 20px;
    border-right: 1px solid #a0b1b8;
    line-height: 15px;
    font-size: 13px;
    color: #a0b1b8;
    display: inline-block;
}

.footer-bottom-link li:first-child {
    padding-left: 0;
}

.footer-bottom-link li:last-child {
    padding-right: 0;
}

.footer-bottom-link li a {
    color: #fff;
    font-size: 13px;
    line-height: 15px;
    transition: 0.3s;
}

.copyright-left-text p a {
    color: var(--purple);
}

.footer-bottom-link li:last-child {
    border: none;
}

.footer-bottom-link li a:hover,
.copyright-right-text p i {
    color: var(--purple);
}

.footer-menu.main-navigation {
    height: auto;
    margin: 35px 0px 37px;
    text-align: center;
}

.footer-menu.main-navigation li {
    margin: 0 20px;
    float: none;
    display: inline-block;
}

.footer-menu.main-navigation li a {
    color: #ffffff;
    font-size: 16px;
    padding: 0;
}

.footer-menu.main-navigation li a:hover {
    color: var(--purple);
}

.footer-menu.main-navigation li a:before,
.footer-menu.main-navigation li a:after {
    display: none;
}

.footer-menu.main-navigation ul.sub-menu li a {
    color: var(--purple);
    padding: 15px 0px;
}

.footer-menu.main-navigation ul ul {
    top: -150px;
}

.social-icon {
    text-align: right;
    font-size: 0;
    line-height: 1;
}

.social-icon a {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 35px;
    height: 35px;
    background: rgb(255 255 255 / 50%);
    position: relative;
    top: 0;
    border-radius: 30px;
    font-size: 16px;
    color: #ffffff;
    margin-left: 10px;
    transition: 0.3s;
    box-shadow: 0 3px 6px rgb(0 0 0 / 0.16);
}

.social-icon a:hover {
    background: var(--purple);
    position: relative;
    top: -5px;
}

.social-icon a:first-child {
    margin-left: 0;
}

.social-icon a.fb {
    background: #3b5998;
}

.social-icon a.insta {
    background: #8a3ab9;
}

.social-icon a.twitter {
    background: #00acee;
}

.social-icon a.linkedin {
    background: #0e76a8;
}

.social-icon a.pinterest {
    background: #e60023;
}

/*========== Footer End ==========*/

/* ===== wordpress plugin Start ===== */

.main-banner.wordpress-plugin {
    padding: 130px 0px 80px;
}

.main-banner.wordpress-themes {
    padding: 130px 0 80px;
}

.main-banner.wordpress-plugin .banner-content,
.main-banner.wordpress-themes .banner-content {
    padding: 0;
    padding-left: 30px;
}

.main-banner.wordpress-plugin .banner-content p,
.main-banner.wordpress-themes .banner-content p {
    font-size: 18px;
    line-height: 30px;
    margin: 15px 0px 0;
}

.main-banner.wordpress-plugin .banner-content .sec-btn,
.main-banner.wordpress-themes .banner-content .sec-btn {
    margin-top: 36px;
}

.wp-plugins-list {
    padding: 92px 0px 100px;
    background: rgb(222 232 255 / 0.2);
}

.wp-plugins-list .title p {
    color: #3e3e3e;
    margin-top: 39px;
    margin-bottom: 12px;
}

.wp-plugins-list .sec-btn.view-more svg,
.themes-list .sec-btn.view-more svg {
    transform: rotate(90deg);
}

.pro-tag-wp {
    overflow: hidden;
    position: absolute;
    left: 0;
    top: 0;
    width: 100px;
    height: 100px;
    pointer-events: none;
}

.pro-tag {
    width: 105px;
    background: var(--purple);
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
    transform: rotate(-45deg) translate(-25px, 8px);
    display: inline-block;
    position: relative;
    left: -15px;
    top: -10px;
    box-shadow: 0 0 30px rgb(0 0 0 / 10%);
    text-align: center;
}

/* ===== wordpress plugin-page End ===== */

/* ===== single plugin Page Start ===== */

.single-plugin .banner-img {
    width: 600px;
}

.single-plugin .banner-img img {
    width: 100%;
    height: 583px;
}

.main-banner.single-plugin {
    padding: 200px 0px 90px;
}

.main-banner.single-plugin .banner-content {
    padding: 83px 0px 0px 30px;
}

.main-banner.single-plugin .sec-btn {
    margin-top: 37px;
}

.min-btn {
    border: 2px solid #1a2a43;
    background: #fff;
    color: #1a2a43;
}

.min-btn svg path {
    fill: #1a2a43;
}

.min-btn:hover svg path {
    fill: #fff;
    transition: 0.5s;
}

.about-plugin {
    padding: 72px 0px 100px 0;
    background: rgb(222 232 255 / 0.2);
}

.about-plugin .line {
    margin-left: 0pc;
}

.about-content {
    padding: 0;
}

.about-content p {
    margin-bottom: 20px;
}

.about-content p a,
.about-content li a {
    color: var(--purple);
    transition: 0.3s;
}

.about-content p a:hover,
.about-content li a:hover {
    text-decoration: underline !important;
}

.usage {
    position: relative;
    color: var(--purple);
    font-size: 20px;
    line-height: 28px;
    font-weight: 500;
    margin: 15px 0px 23px 0;
    display: inline-block;
    padding-right: 60px;
}

.usage:before {
    content: "";
    display: block;
    position: absolute;
    top: 15px;
    right: 0;
    height: 2px;
    width: 40px;
    background: var(--dark-gray);
}

.about-content p .usage {
    margin-top: 31px;
    margin-bottom: 2px;
}

.plugins-img {
    height: 378px;
    width: 100%;
    position: relative;
    margin-top: 62px;
    border-radius: 10px;
    overflow: hidden;
}

.plugins-img:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: var(--dark-gray);
    opacity: 0.6;
    pointer-events: none;
}

.play-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 80px;
    width: 80px;
    background: rgb(107 162 41 / 70%);
    border-radius: 100px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding-left: 5px;
    transition: 0.3s;
}

.play-btn:hover {
    background: var(--purple);
}

.play-btn i.fas.fa-play {
    color: #fff;
    font-size: 20px;
}

.plugin-details,
.donate {
    background: #fff;
    padding: 30px 40px 40px 40px;
    margin-left: 70px;
    border-radius: 10px;
    text-align: center;
    box-shadow: 1px 1px 1px rgb(0 0 0 / 15%);
}

.plugin-details h3 {
    font-size: 25px;
    line-height: 32px;
    color: var(--purple);
    margin-bottom: 28px;
    text-align: left;
    font-weight: bold;
}

.plugin-details ul {
    text-align: left;
}

.plugin-details ul li {
    color: #666666;
    font-size: 14px;
    line-height: 26px;
    margin-bottom: 10px;
}

.plugin-details ul li.plugin-price strong {
    color: var(--purple);
    font-size: 19px;
}

.plugin-details ul li.plugin-price b {
    color: var(--purple);
}

.plugin-details ul li.rating-title b {
    font-size: 20px;
    color: var(--purple);
}

.plugin-details ul li.rating-title strong {
    font-size: 13px;
    vertical-align: sub;
    color: var(--purple);
}

.plugin-title {
    font-size: 16px;
    font-weight: bold;
    color: var(--dark-gray);
    margin-right: 0px;
    width: 153px;
    display: inline-block;
}

.plugin-details span {
    margin-right: 12px !important;
    font-size: 16px;
    font-weight: bold;
    color: var(--dark-gray);
    margin-right: 0px;
}

.plugin-details .sec-btn {
    width: 270px;
    margin-top: 22px;
    background: transparent;
    border: 2px solid var(--dark-gray);
    color: var(--dark-gray);
    box-shadow: unset;
    padding: 8px 5px;
}

.plugin-details .sec-btn:hover {
    background: var(--dark-gray);
    color: #ffffff;
}

.plugin-details .transparent-btn.plugin-buy-btn svg path {
    stroke: transparent;
    transition: 0.3s;
}

.plugin-details .transparent-btn.plugin-buy-btn:hover svg path {
    fill: #fff;
}

.plugin-details ul li span:first-of-type {
    margin-right: 0px !important;
}

.plugin-details ul li .star-rating-wp {
    display: inline-block;
    vertical-align: middle;
    margin-left: -5px;
}

.plugin-details ul li .star-rating-wp .star-rating {
    font-size: 20px;
    margin-top: 0;
}

.plugin-details ul li .star-rating .star-rating__fill {
    margin: 0 !important;
    font-size: 20px;
    font-weight: normal;
}

.donate .sec-btn.min-btn {
    margin: 0;
    background: transparent;
    color: var(--purple);
    border-color: var(--purple);
    box-shadow: unset;
}

.donate .sec-btn.min-btn:hover {
    background: var(--purple);
    color: #ffffff;
}

.donate {
    margin-top: 30px;
    padding: 30px 20px 25px;
}

.donate h3 {
    color: var(--dark-gray);
    font-weight: bold;
}

.donate p {
    font-size: 14px;
    margin-bottom: 13px;
}

.shortcode.back-img,
.screenshot-section.back-img {
    background-attachment: fixed;
}

.shortcode:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 50%;
    background: rgb(222 232 255 / 0.2);
    pointer-events: none;
}

.usage-sub-title {
    font-size: 17px;
    text-transform: capitalize;
    position: relative;
    color: var(--purple);
    margin-bottom: 10px;
}

.usage-sub-title:before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(-50%, -50%);
    width: 5px;
    height: 5px;
    border-radius: 30px;
    background: var(--purple);
    display: none;
}

.fonts-links {
    color: var(--purple);
    font-weight: bold;
    text-decoration: underline !important;
    transition: 0.5s;
}

.fonts-links:hover {
    transition: 0.5s;
    color: var(--dark-gray);
}

/* plugin-features Start */

.plugin-features {
    padding: 92px 0px 70px;
}

.features-list {
    padding-top: 43px;
}

.features {
    padding: 2px 0px 0px 55px;
    position: relative;
    margin-bottom: 30px;
}

.features p {
    font-size: 15px;
    line-height: 24px;
    margin: 0;
}

.features span {
    position: absolute;
    top: 0;
    left: 0;
    height: 40px;
    width: 40px;
    background: var(--purple);
    border-radius: 50px;
    box-shadow: 2px 0 10px rgb(0 0 0 / 0.1);
    display: flex;
    justify-content: center;
    align-items: center;
}

.features span svg {
    width: 18px;
    height: 18px;
}

.features span svg path {
    fill: var(--white-color);
}

.shortcode-details {
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 0 30px rgb(0 0 0 / 10%);
    padding: 32px;
    position: relative;
    z-index: 1;
}

.shortcode-details:before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: calc(100% - 30px);
    width: calc(100% - 30px);
    border: 2px solid var(--purple);
    border-radius: 10px;
    z-index: -1;
    pointer-events: none;
}

.shortcode-details h3 {
    color: var(--purple);
    font-size: 25px;
    font-weight: bold;
    margin: 10px 0px 28px;
}

.shortcode-details p {
    margin-bottom: 10px;
}

.shortcode {
    padding: 0;
    position: relative;
    background-attachment: fixed;
}

.shortcode-details ul li {
    display: block;
    margin-bottom: 15px;
}

.shortcode-details ul li:last-child {
    margin-bottom: 10px;
}

.shortcode-details ul li span {
    display: block;
    font-weight: bold;
}

/* plugin-features End */

/* features-box-sec Start */

.features-box-sec {
    padding-bottom: 60px;
}

.features-box-row {
    padding: 30px;
    background: #fbfbfb;
    border-radius: 20px;
    margin-bottom: 30px;
    border: 1px solid rgb(107 162 41 / 30%);
}

.features-box-row:last-child {
    margin-bottom: 0;
}

.features-box-img {
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 0px 30px rgb(0 0 0 / 2%);
}

.features-box-text {
    padding: 0 20px;
}

.features-box-text h2 {
    font-size: 30px;
    line-height: 40px;
    margin-bottom: 10px;
    color: var(--purple);
}

.features-box-text p:last-child {
    margin: 0;
}

/* features-box-sec End */

/*Plugins Videos Start*/

.main-plugins-videos {
    position: relative;
    padding: 72px 0 100px 0;
    background: rgb(222 232 255 / 0.2);
}

.main-plugins-videos .video-section {
    padding-top: 0;
}

.video-section .title {
    margin-bottom: 62px;
}

.plugins-videos-slider .plugins-img {
    width: 100%;
    height: 450px;
    background-position: bottom center;
    margin-top: 0;
}

.plugin-video-thumbnail-slider {
    margin-top: 30px;
}

.plugin-video-thumbnail-box {
    width: 100%;
    height: 100px;
    border-radius: 10px;
    position: relative;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    cursor: pointer;
}

.main-plugins-videos .video-section .slick-arrow {
    left: -30px;
}

.main-plugins-videos .video-section .slick-next.slick-arrow {
    left: auto;
    right: -30px;
    transform: translate(-0%, -50%) rotate(180deg);
}

.video-thumbnail-slider .slick-slide.slick-current .plugin-video-thumbnail-box {
    border: 2px solid var(--purple);
}

/*Plugins Videos End*/

/* screenshot-section Start */

.screenshot-section {
    position: relative;
    margin-bottom: 340px;
    padding-top: 92px;
    margin-top: 0;
}

.screenshot-slider {
    border-radius: 30px;
    box-shadow: 0 20px 40px rgb(0 0 0 / 0.15);
    height: 480px;
    border: 20px solid var(--purple);
    margin-top: 42px;
    margin-bottom: -240px;
}

.screenshot-img {
    height: 440px;
    overflow: hidden;
    min-height: 0px;
    border: 0px;
}

.slick-arrow,
.slick-prev:focus,
.slick-next:focus {
    top: 50%;
    left: -40px;
    transform: translate(-0%, -50%);
    z-index: 9;
    position: absolute;
    height: 60px;
    width: 60px;
    border-radius: 100px;
    background: var(--dark-gray);
    box-shadow: 0 0 15px rgb(0 0 0 / 0.15);
}

.slick-arrow:before {
    content: " " !important;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 30px;
    transition: 0.3s;
    opacity: 1;
    display: block;
    cursor: pointer;
    z-index: 1;
    width: 30px;
    height: 22px;
    background-image: url("assets/images/arrows-right.png");
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
}

button.slick-next.slick-arrow {
    left: auto;
    right: -40px;
    transform: translate(0%, -50%) rotate(180deg);
}

.slick-prev:hover,
.slick-next:hover {
    background: var(--purple);
}

.screenshot-slider-img {
    height: 100%;
    width: 100%;
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: top center;
    background-color: #ffffff;
    transition: 3s ease-in-out;
}

.screenshot-slider-img:hover {
    background-position: bottom center;
}

.screenshot-slider .slick-list.draggable {
    border-radius: 10px;
    overflow: hidden;
}

.single-wordpress-plugins .screenshot-slider-img,
.single-wordpress-plugins .screenshot-slider-img:hover {
    background-position: center;
}

/* screenshot-section End */

.plugin-banner {
    position: relative;
    text-align: center;
    margin-top: -85px;
}

.plugin-banner img {
    height: 100%;
    width: auto;
    border-radius: 10px;
}

.about-plugin-list li,
.features-box-text ul li {
    padding-left: 15px;
    position: relative;
    color: var(--dark-gray);
}

.features-box-text ul li.features-sub-list:before {
    display: none;
}

.about-plugin-list li:before,
.features-box-text ul li:before {
    content: "";
    display: block;
    position: absolute;
    top: 11px;
    left: 0;
    height: 5px;
    width: 5px;
    background: var(--purple);
    border-radius: 30px;
}

.about-plugin-list {
    padding-left: 0;
}

.plugin-banner:after {
    content: "";
    display: block;
    position: absolute;
    top: 85px;
    width: 100%;
    height: calc(100% - 85px);
    background: rgb(222 232 255 / 0.2);
    z-index: 0;
}

.plugin-bg {
    display: inline-block;
    position: relative;
    padding: 30px;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 0 30px rgb(0 0 0 / 10%);
    z-index: 9;
    background: #fff;
}

.plugin-bg:before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: calc(100% - 30px);
    width: calc(100% - 30px);
    border: 2px solid var(--purple);
    border-radius: 10px;
    z-index: 1;
    pointer-events: none;
}

.plugin-bg.logo-preview {
    width: 400px;
    max-width: 100%;
}

.product-updates .search-form .wpcf7-not-valid-tip {
    display: none;
}

/* ===== single plugin Page End ===== */

/* =====  wordpress-themes-page Start ===== */

.themes-list {
    padding: 92px 0px 100px;
}

.themes-list.graphic-template-realted {
    padding-top: 0px;
    margin-top: -8px;
}

.themes-list .title {
    padding-bottom: 20px;
}

.wordpress-themes .banner-img {
    width: 100%;
    height: auto;
    max-width: unset;
    max-height: unset;
}

.wordpress-themes .banner-img img {
    width: 100%;
    height: auto;
}

.wordpress-themes .banner-content {
    padding-left: 0px !important;
}

.theme-box {
    border-radius: 10px;
    overflow: hidden;
    position: relative;
    box-shadow: 5px 5px 30px rgb(0 0 0 / 30%);
    margin-bottom: 30px;
}

.theme-img {
    height: 450px;
    background-size: cover;
    background-position: top center;
    background-repeat: no-repeat;
}

.theme-img img {
    width: 100%;
    object-fit: cover;
    object-position: center;
}

.themes .theme-img {
    height: auto;
}

.theme-details {
    position: absolute;
    bottom: 0;
    height: 90px;
    width: 100%;
    transition: 0.5s;
    background: rgb(0 0 0 / 0.8);
    text-align: center;
    padding: 17px 30px;
    transition: 0.5s;
}

.theme-box:hover .theme-details {
    background: rgb(0 0 0 / 0.95);
    height: 340px;
    padding: 23px 30px;
}

.theme-details h3 {
    font-size: 20px;
    line-height: 30px;
    color: #ffffff;
    font-weight: bold;
    height: 60px;
    display: -webkit-box;
    width: 100%;
    text-align: center;
    -webkit-box-orient: vertical;
    overflow: hidden;
    -webkit-line-clamp: 2;
    margin-bottom: 0;
}

.theme-details h3 a {
    color: #ffffff;
    transition: 0.3s;
}

.theme-details h3 a:hover {
    color: var(--purple);
}

.theme-details p {
    color: rgb(255 255 255 / 0.8);
    font-size: 14px;
    line-height: 20px;
    margin: 12px 0px 18px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.theme-btn {
    width: 170px;
    display: block;
    margin: auto;
}

.theme-btn .sec-btn.min-btn {
    display: flex;
    background: transparent;
    color: #fff;
    margin: 0 auto 20px auto;
    border-color: #fff;
    transition: 0.4s;
    padding: 10px 5px;
    margin-top: 0px;
}

.theme-btn .sec-btn.min-btn:first-child {
    border-color: var(--purple);
    color: var(--purple);
}

.theme-btn .sec-btn.min-btn:hover {
    color: var(--purple);
    border-color: #ffffff;
    background: #ffffff;
    transition: 0.4s;
}

.theme-btn .sec-btn.min-btn:first-child:hover {
    border-color: var(--purple);
    background: var(--purple);
    color: #ffffff;
    transition: 0.4s;
}

.theme-btn .sec-btn.min-btn:last-child {
    margin-bottom: 0;
}

.themes-list .sec-btn {
    background: var(--purple);
    border-color: var(--purple);
    margin-top: 30px;
}

.themes-list .sec-btn.view-more:hover {
    background: var(--dark-gray);
    border-color: var(--dark-gray);
}

.all-htmlthemes .result-pagination,
.all-graphicstemplates .result-pagination {
    margin-top: 30px;
}

.all-graphicstemplates .theme-box:hover .theme-details,
.themes-list.graphic-template-realted .theme-box:hover .theme-details {
    height: 280px;
}

/* =====  wordpress-themes-page End ===== */

/* =====  themes-single-page End ===== */

.single-theme .banner-img {
    top: 0;
    position: relative;
    right: 0;
    width: 100%;
    height: 100%;
    padding: 20px;
    background: #fff;
    box-shadow: 0 0 30px rgb(0 0 0 / 10%);
    border-radius: 10px;
    margin-bottom: 0;
}

.single-theme .banner-img img {
    width: 100%;
    height: auto;
    object-fit: cover;
    padding: 10px;
    border-radius: 20px;
}

.single-theme .banner-img:before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: calc(100% - 30px);
    width: calc(100% - 30px);
    border: 2px solid var(--purple);
    border-radius: 10px;
    z-index: 1;
    pointer-events: none;
}

.theme-slider {
    /* background-image: url(http://store.geekwebsolution.com/wp-content/uploads/2020/10/mockup-frame.png); */
    height: 302px;
    width: 100%;
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center;
}

/* .mobile-view {
    position: absolute;
    top: 0;
    left: 0;
    width: 50px;
    height: 106px;
    z-index: 1;
    background-size: cover;
}

.mobile-view {
    background-image: url(assets/images/mobile.png);
    position: absolute;
    width: 85px;
    height: 186px;
    top: 359px;
    left: 215px;
    z-index: 5;
    background-repeat: no-repeat;
    background-size: 100%;
}

.tablet-view {
    background-image: url(assets/images/tablet.png);
    width: 200px;
    height: 320px;
    z-index: 3;
    position: absolute;
    left: 0;
    top: 280px;
    background-repeat: no-repeat;
    background-size: 100%;
}

.laptop-view {
    background-image: url(assets/images/laptop.png);
    width: 350px;
    height: 307px;
    top: 331px;
    left: 380px;
    position: absolute;
    z-index: 2;
    background-repeat: no-repeat;
    background-size: 100%;
}

.desktop-view {
    position: absolute;
    width: 526px;
    height: 510px;
    background-image: url(assets/images/desktop.png);
    top: 0px;
    left: 50px;
    z-index: 1;
    background-repeat: no-repeat;
    background-size: 100%;
}

.mobile-frame {
    height: 161px;
    width: 100%;
    background-size: 100%;
    background-repeat: no-repeat;
    position: absolute;
    top: 0px;
    left: 0;
}

.mobile-view .trim {
    background-repeat: no-repeat;
    background-size: 100%;
    overflow: auto;
    width: 75px;
    height: 161px;
    position: relative;
    top: 8px;
    border-radius: 7px;
    left: 5px;
}

.tablet-frame {
    height: 238px;
}

.tablet-view .trim {
    width: 177px;
    height: 238px;
    top: 8px;
    left: 8px;
    overflow-y: hidden;
    position: relative;
    transform-origin: top left;
    -webkit-transform-origin: top left;
    -o-transform-origin: top left;
    -ms-transform-origin: top left;
    -moz-transform-origin: top left;
    border-radius: 3px;
}

.laptop-frame {
    height: 618px;
}

.laptop-view .trim {
    width: 980px;
    height: 613px;
    top: 12px;
    left: 39px;
    position: relative;
    transform: scale(0.277);
    -webkit-transform: scale(0.277);
    -o-transform: scale(0.277);
    -ms-transform: scale(0.277);
    -moz-transform: scale(0.277);
    transform-origin: top left;
    -webkit-transform-origin: top left;
    -o-transform-origin: top left;
    -ms-transform-origin: top left;
    -moz-transform-origin: top left;
}

.laptop-frame,
.desktop-frame,
.tablet-frame {
    width: 100%;
    background-repeat: no-repeat;
    background-size: 100%;
}

.desktop-frame {
    height: 930px;
}

.desktop-view .trim {
    left: 22px;
    top: 20px;
    width: 1520px;
    height: 930px;
    transform: scale(0.3181);
    -webkit-transform: scale(0.3181);
    -o-transform: scale(0.3181);
    -ms-transform: scale(0.3181);
    -moz-transform: scale(0.3181);
    transform-origin: top left;
    -webkit-transform-origin: top left;
    -o-transform-origin: top left;
    -ms-transform-origin: top left;
    -moz-transform-origin: top left;
    position: relative;
}
 */

.about-theme {
    background: rgb(222 232 255 / 0.25);
    padding: 92px 0px 100px;
}

.about-theme-content .line {
    margin-left: 0px;
}

.about-theme-content .overflow-text {
    margin: 50px 0px 40px;
}

.about-theme-content .overflow-text {
    height: auto;
    max-height: unset;
    margin: 38px 0px 20px;
}

.about-theme-content .btn-wp {
    justify-content: flex-start;
    text-align: left;
}

.about-theme-content .btn-wp>.sec-btn {
    margin-left: 30px;
}

.specification-box {
    width: 100%;
    min-height: 140px;
    background: #ffffff;
    text-align: center;
    box-shadow: 1px 1px 1px 0px rgb(0 0 0 / 0.15);
    border-radius: 10px;
    padding: 20px 10px;
    margin-bottom: 30px;
}

.specification-box img {
    height: 40px;
    margin: auto;
    display: block;
}

.specification-box h3 {
    display: block;
    width: 100%;
    font-size: 16px;
    line-height: 23px;
    margin: 15px 0 0;
    font-weight: 700;
    color: var(--purple);
}

.theme-specification {
    width: 100%;
    margin-bottom: -30px;
}

.theme-overview .themes-part svg path {
    fill: var(--purple);
}

.theme-overview .themes-part ul li span {
    margin-right: 5px;
}

.theme-overview .themes-part ul li {
    display: flex;
    align-items: center;
    margin-bottom: 11px;
    font-size: 16px;
    line-height: 26px;
    color: #3e3e3e;
}

.theme-overview .themes-part .overflow-text {
    margin-bottom: 28px;
}

.first-img {
    height: 280px;
    border-radius: 20px;
    box-shadow: 0 0 20px rgb(0 0 0 / 0.15);
    border: 5px solid rgb(222 232 255);
}

.second-img {
    width: 370px;
    height: 200px;
    position: absolute;
    top: 179px;
    left: -98px;
    z-index: 9;
    border-radius: 20px;
    box-shadow: 0 0 20px rgb(0 0 0 / 0.15);
    border: 5px solid rgb(222 232 255);
}

.theme-overview .theme-img {
    position: relative;
    height: 100%;
}

.page-template-singletheme-page .themes-list .sec-btn.view-more svg {
    transform: rotate(0);
}

.theme-img.even .second-img {
    left: auto;
    right: -95px;
}

.theme-overview .themes-part .row {
    margin-bottom: 65px;
}

.btn-wp {
    font-size: 0;
    line-height: 1;
    margin-top: 20px;
    display: flex;
    justify-content: center;
}

.single-theme .sec-btn,
.single-plugin .sec-btn {
    margin: 0 !important;
}

.btn-wp .sec-btn {
    font-size: 16px;
    line-height: 24px;
    margin-top: 0 !important;
    margin-left: 30px;
}

.btn-wp .sec-btn:first-child {
    margin-right: 0 !important;
    margin-left: 0 !important;
}

.btn-wp .sec-btn.live-demo {
    border-color: var(--white-color);
    background: var(--white-color);
    color: var(--purple);
    margin-left: 30px;
}

.btn-wp .sec-btn.live-demo:hover {
    border-color: var(--purple);
    background: var(--purple);
    color: var(--white-color);
}

.btn-wp form.cart~.sec-btn {
    margin-left: 30px !important;
}

.btn-wp form.cart .sec-btn {
    margin-right: 0 !important;
    margin-left: 0 !important;
}

.star-rating-wp {
    display: block;
}

.star-rating {
    font-size: 1.5rem;
    position: relative;
    margin-top: 15px;
    display: inline-block;
}

.star-rating:before {
    content: "\f005\f005\f005\f005\f005";
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    color: #e5e5e5;
    filter: drop-shadow(0 0.6rem 0.3rem rgba(0, 0, 0, 0.05));
    letter-spacing: 4px;
}

.star-rating__fill {
    position: absolute;
    display: inline-block;
    top: 0;
    left: 0;
    overflow: hidden;
    animation: fill-star 2s ease-in-out;
}

.star-rating__fill:before {
    content: "\f005\f005\f005\f005\f005";
    color: #ffc107;
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    letter-spacing: 4px;
}

@keyframes fill-star {
    0% {
        width: 0;
    }
}

/* =====  themes-single-page End ===== */

/* =====  preview-page Start ===== */

.page-template-preview-page {
    height: 100vh;
    background: #fafafa;
    overflow: hidden;
}

.page-template-preview-page .textimonial,
.page-template-preview-page footer,
.page-template-preview-page header {
    display: none;
}

.preview-header {
    height: 80px;
    background: var(--dark-gray);
    position: fixed;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 10;
}

.preview-header .site-branding {
    position: relative;
    display: flex;
    align-items: center;
    height: 80px;
}

.preview-header .site-branding a {
    width: 65px;
}

.preview-devices ul {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 80px;
}

.preview-devices ul li {
    padding: 0px 15px;
    transition: 0.5s;
}

.preview-devices ul li:hover a svg g path,
.active-devices svg g path {
    fill: var(--purple);
    transition: 0.5s;
}

.preview-devices ul li a img {
    filter: brightness(10);
    transition: 0.5s;
}

.preview-devices ul li a:hover img,
.preview-devices ul li a.active-devices img {
    filter: brightness(1);
}

.preview-header-btn {
    display: flex;
    height: 80px;
    align-items: center;
    justify-content: flex-end;
}

.preview-header-btn .sec-btn {
    width: 120px;
    height: 35px;
    padding: 0px;
    padding-top: 4px;
    margin-right: 30px;
    border: 2px solid var(--purple);
    color: var(--purple);
    background: transparent;
    transition: 0.5s;
}

.preview-header-btn .sec-btn:hover {
    color: #ffffff;
    border-color: var(--purple);
    background: var(--purple);
    transition: 0.5s;
}

.preview-header-btn .sec-btn.min-btn {
    border-color: #ffffff;
    background: transparent;
    color: #ffffff;
}

.preview-header-btn .sec-btn.min-btn:hover {
    background: #ffffff;
    color: var(--purple);
    border-color: #ffffff;
    transition: 0.5s;
}

.close-icon {
    background: #fff;
    border-radius: 50px;
    height: 35px;
    width: 35px;
    position: relative;
    transition: 0.3s;
}

.close-icon:hover {
    background: var(--purple);
}

.close-icon svg {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-54%, -45%);
}

.close-icon svg g path {
    fill: var(--purple);
}

.close-icon:hover svg g path {
    fill: #ffffff;
}

.preview {
    position: absolute;
    top: 80px;
    left: 50%;
    transform: translate(-50%);
    width: 100%;
    height: calc(100vh - 80px);
    opacity: 0;
    -webkit-transition: opacity 0.3s cubic-bezier(0.694, 0, 0.335, 1);
    -o-transition: opacity 0.3s cubic-bezier(0.694, 0, 0.335, 1);
    transition: opacity 0.3s cubic-bezier(0.694, 0, 0.335, 1);
}

.preview-show {
    opacity: 1 !important;
    -webkit-transition: opacity 0.3s cubic-bezier(0.694, 0, 0.335, 1);
    -o-transition: opacity 0.3s cubic-bezier(0.694, 0, 0.335, 1);
    transition: opacity 0.3s cubic-bezier(0.694, 0, 0.335, 1);
    z-index: 9;
}

.preview iframe {
    height: 100%;
    width: 100%;
    max-width: 100%;
    border: none;
    display: block;
    margin: auto;
    box-shadow: 0px 20px 40px rgb(0 0 0 / 10%);
}

.desktop-preview.preview iframe {
    width: 100%;
}

.laptop-preview.preview iframe {
    width: 1366px;
}

.tablet-preview.preview iframe {
    width: 767px;
}

.mobile-landscape-preview.preview iframe {
    width: 575px;
    height: 300px;
}

.mobile-preview.preview iframe {
    width: 375px;
}

/* =====  preview-page End ===== */

/*========== Shop Page CSS Start ==========*/

.woocommerce-error,
.woocommerce-info,
.woocommerce-message {
    border-top-color: var(--purple);
    padding: 20px 200px 20px 50px;
    position: relative;
}

.woocommerce-error::before,
.woocommerce-info::before,
.woocommerce-message::before {
    color: var(--purple);
    position: absolute;
    top: 20px;
    left: 20px;
}

.woocommerce-error a,
.woocommerce-info a,
.woocommerce-message a {
    position: absolute !important;
    top: 50%;
    right: 20px;
    transform: translate(0, -50%);
    width: 170px;
    font-size: 12px;
    text-align: right;
    color: var(--purple);
    font-weight: 600;
    transition: 0.3s;
}

.woocommerce-error a:hover,
.woocommerce-info a:hover,
.woocommerce-message a:hover {
    text-decoration: underline !important;
}

.woocommerce .woocommerce-error .button,
.woocommerce .woocommerce-info .button,
.woocommerce .woocommerce-message .button,
.woocommerce-page .woocommerce-error .button,
.woocommerce-page .woocommerce-info .button,
.woocommerce-page .woocommerce-message .button {
    font-size: 16px;
    text-align: center;
    color: #ffffff;
    font-weight: 700;
}

.woocommerce .woocommerce-error .button:hover,
.woocommerce .woocommerce-info .button:hover,
.woocommerce .woocommerce-message .button:hover,
.woocommerce-page .woocommerce-error .button:hover,
.woocommerce-page .woocommerce-info .button:hover,
.woocommerce-page .woocommerce-message .button:hover {
    text-decoration: unset !important;
}

.woocommerce form .form-row {
    padding: 0;
    margin: 0 0 15px 0;
}

.woocommerce form .form-row:last-child {
    margin-bottom: 0;
}

.shop-title.title {
    margin-bottom: 40px;
}

.shop-title.title .line {
    margin-left: 0;
}

.result-sorting-box {
    margin-bottom: 30px;
}

.woocommerce .woocommerce-result-count {
    margin-bottom: 0;
}

.woocommerce .woocommerce-ordering {
    margin-bottom: 0;
}

.woocommerce .woocommerce-ordering select.form-input {
    width: 200px;
    padding: 5px 40px 5px 20px;
    height: 40px;
    background: rgba(0, 0, 0, 0.05);
    font-size: 14px;
}

select,
select.form-input {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden !important;
    padding-right: 30px;
}

.woocommerce .woocommerce-ordering.form-element i {
    top: 12px;
    font-size: 16px;
}

.woocommerce nav.woocommerce-pagination {
    margin-top: 30px;
}

.woocommerce nav.woocommerce-pagination ul li a:focus,
.woocommerce nav.woocommerce-pagination ul li a:hover,
.woocommerce nav.woocommerce-pagination ul li span.current {
    border-radius: 0;
}

.woocommerce nav.woocommerce-pagination ul {
    border: 0;
    margin: 0;
}

.woocommerce.woocommerce-page nav.woocommerce-pagination ul li {
    border-right: unset;
}

.product-tab.dropdown {
    position: relative;
    margin-bottom: 30px;
    z-index: 10;
}

.product-tab.dropdown .dropdown-toggle {
    display: none;
}

.woocommerce-categories.dropdown-menu {
    display: block;
    position: relative;
    float: none;
    background: transparent;
    border: none;
    padding: 0;
    font-size: 16px;
    border-radius: 0;
    margin: 0;
}

.woocommerce-categories.dropdown-menu li {
    display: inline-block;
    margin-right: 15px;
}

.woocommerce-categories.dropdown-menu li:last-child {
    margin-right: 0;
}

.woocommerce-categories.dropdown-menu li a {
    display: inline-block;
    padding: 5px 15px;
    background: rgba(0, 0, 0, 0.05);
    font-size: 16px;
    color: #3e3e42;
    border-radius: 20px;
    transition: 0.3s;
}

.woocommerce-categories.dropdown-menu li a:hover {
    background: var(--purple);
    color: #ffffff;
}

.woocommerce .products ul,
.woocommerce ul.products {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: flex-start;
    margin-left: -15px;
    margin-right: -15px;
    margin-bottom: -30px;
}

.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
    float: none;
    display: inline-block;
    width: 33.3333%;
    margin: 0;
    padding: 0 15px;
    margin-bottom: 30px;
}

.product-box {
    background: #fff;
    border-radius: 10px;
    padding: 0;
    box-shadow: 0 0 5px rgb(0 0 0 / 5%);
    position: relative;
    top: 0;
    text-align: center;
    transition: 0.4s;
}

.product-box:hover {
    position: relative;
    top: -10px;
    box-shadow: 0px 20px 40px rgb(0 0 0 / 10%);
    transition: 0.4s;
}

.product-box .woocommerce-LoopProduct-link {
    display: inline-block;
    width: 100%;
}

.product-box a .custom_product_img {
    position: relative;
    border-radius: 10px 10px 0 0;
    overflow: hidden;
    margin-bottom: 30px;
}

.product-box a .custom_product_img img {
    margin: 0 !important;
}

.woocommerce ul.products li.product .onsale {
    position: absolute;
    top: 10px;
    right: 10px;
    margin: 0;
    width: 50px;
    height: 50px;
    background: var(--purple);
    padding: 0;
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.woocommerce ul.products li.product a img {
    height: 300px;
    object-fit: cover;
    object-position: center;
}

.woocommerce ul.products li.product .woocommerce-loop-category__title,
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h3 {
    font-size: 20px;
    line-height: 26px;
    color: var(--dark-gray);
    padding: 0;
    margin-bottom: 15px;
    transition: 0.3s;
}

.product-box .woocommerce-LoopProduct-link .woocommerce-loop-product__title:hover {
    color: var(--purple) !important;
}

.woocommerce ul.products li.product .price {
    color: var(--purple);
    font-size: 20px;
    margin-bottom: 15px;
}

.woocommerce ul.products li.product .price del {
    color: var(--dark-gray);
    opacity: 0.3;
    font-size: 16px;
}

.woocommerce .button {
    width: 170px !important;
    height: 46px !important;
    background: var(--dark-gray) !important;
    border-radius: 40px !important;
    padding: 15px 5px !important;
    font-size: 16px !important;
    color: #ffffff !important;
    font-weight: bold !important;
    text-transform: capitalize !important;
    outline: none !important;
    text-align: center;
    transition: 0.3s;
}

.woocommerce .button:hover {
    background: var(--purple) !important;
    color: #ffffff !important;
}

.woocommerce ul.products li.product .button {
    margin-top: 0;
}

.woocommerce ul.products li.product .button.add_to_cart_button,
.woocommerce ul.products li.product .button.product_type_simple {
    margin: 5px 0 30px 0;
}

.woocommerce a.added_to_cart.wc-forward {
    margin-left: 10px;
    font-size: 16px;
    color: var(--purple);
    font-weight: 600;
    transition: 0.3s;
}

.woocommerce a.added_to_cart.wc-forward:hover {
    text-decoration: underline !important;
}

.woocommerce #respond input#submit.loading::after,
.woocommerce a.button.loading::after,
.woocommerce button.button.loading::after,
.woocommerce input.button.loading::after {
    top: 14px;
}

/*========== Shop Page CSS Start ==========*/

/*========== Shop Detail Page CSS Start ==========*/

.inner-page-text .woocommerce-breadcrumb {
    display: none;
}

.woocommerce .woocommerce-breadcrumb {
    font-size: 18px;
    font-weight: 600;
    color: var(--dark-gray);
    margin-bottom: 0;
}

.woocommerce .woocommerce-breadcrumb a {
    color: var(--dark-gray);
    transition: 0.3s;
}

.woocommerce .woocommerce-breadcrumb a:hover {
    color: var(--purple);
    text-decoration: underline !important;
}

.woocommerce div.product {
    position: relative;
    font-size: 16px;
    line-height: 1;
}

.woocommerce span.onsale {
    position: absolute;
    top: 10px;
    left: 10px;
    margin: 0;
    width: 50px;
    height: 50px;
    background: var(--purple);
    padding: 0;
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.woocommerce-product-gallery.woocommerce-product-gallery--with-images.woocommerce-product-gallery--columns-4.images {
    width: 50%;
    margin-bottom: 60px;
}

.woocommerce div.product div.images .woocommerce-product-gallery__wrapper {
    width: 100%;
    height: 400px;
    overflow: hidden;
    border-radius: 10px;
    box-shadow: 0 0 30px rgb(0 0 0 / 10%);
}

.woocommerce div.product div.images .woocommerce-product-gallery__image--placeholder {
    height: 100%;
}

.flex-viewport {
    margin-bottom: 30px;
}

.woocommerce div.product div.images .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image {
    width: 100%;
    height: 400px;
}

.woocommerce div.product div.images img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.woocommerce div.product div.images .flex-control-thumbs {
    font-size: 0;
    line-height: 1;
    margin-left: -10px;
    margin-right: -10px;
}

.woocommerce div.product div.images .flex-control-thumbs li {
    width: 25%;
    padding: 0 10px;
    margin-bottom: 20px;
}

.woocommerce div.product div.images .flex-control-thumbs li img {
    width: 100%;
    height: 100px;
    object-fit: cover;
    object-position: center;
    border-radius: 10px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
    border: 2px solid #dddddd;
    transition: 0.3s;
}

.woocommerce div.product div.images .flex-control-thumbs li img.flex-active {
    border-color: var(--purple);
}

.woocommerce #content div.product div.summary,
.woocommerce div.product div.summary,
.woocommerce-page #content div.product div.summary,
.woocommerce-page div.product div.summary {
    float: left;
    width: 50%;
    padding-left: 30px;
}

.woocommerce div.product .product_title {
    text-transform: capitalize;
    font-size: 35px;
    line-height: 45px;
    color: var(--dark-gray);
    margin-bottom: 20px;
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
    color: var(--purple);
    font-size: 25px;
}

.woocommerce div.product p.price del .woocommerce-Price-amount,
.woocommerce-variation-price del .woocommerce-Price-amount {
    color: var(--dark-gray);
    font-size: 18px;
}

.woocommerce div.product p.stock {
    font-size: 18px;
    font-weight: 700;
    color: var(--purple);
}

.woocommerce div.product form.cart {
    margin-bottom: 30px;
}

.woocommerce div.product form.cart div.quantity {
    float: none;
    margin: 0 0 30px 0;
}

.woocommerce .quantity .qty {
    width: 60px;
    height: 60px;
    font-size: 20px;
    background: rgba(0, 0, 0, 0.1);
    border: 1px solid transparent;
    border-radius: 5px;
}

.woocommerce .quantity .qty:focus {
    border-color: var(--dark-gray);
}

.product_meta .posted_in {
    color: var(--dark-gray);
    font-weight: 500;
}

.product_meta .posted_in a {
    color: var(--purple);
    transition: 0.3s;
}

.product_meta .posted_in a:hover {
    text-decoration: underline !important;
}

.woocommerce-tabs.wc-tabs-wrapper {
    margin-bottom: 80px;
}

.woocommerce div.product .woocommerce-tabs ul.tabs {
    padding: 0;
    margin: 0;
    font-size: 0;
    line-height: 1;
}

.woocommerce div.product .woocommerce-tabs ul.tabs::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after,
.woocommerce div.product .woocommerce-tabs ul.tabs li::before {
    display: none !important;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
    margin: 0;
    padding: 0;
    background: transparent;
    background-color: transparent;
    border: none;
    border-radius: 0;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    padding: 10px 15px;
    background: transparent;
    text-transform: capitalize;
    border-radius: 5px 5px 0 0;
    font-size: 16px;
    transition: 0.3s;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover {
    background: rgba(0, 0, 0, 0.05);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
    background: var(--purple);
    color: #ffffff;
}

.woocommerce div.product .woocommerce-tabs .panel {
    background: rgba(0, 0, 0, 0.05);
    padding: 30px;
    margin-bottom: 0;
}

.woocommerce div.product .woocommerce-tabs .panel h2 {
    font-size: 30px;
    margin-bottom: 15px;
}

.woocommerce div.product .woocommerce-tabs .panel p:last-child {
    margin-bottom: 0;
}

.woocommerce table.shop_attributes {
    border: 1px solid #cccccc;
    margin-bottom: 0;
}

.woocommerce table.shop_attributes tr {
    border-bottom: 1px solid #cccccc;
}

.woocommerce table.shop_attributes tr:last-child {
    border-bottom: none;
}

.woocommerce table.shop_attributes th {
    padding: 10px 15px;
    border: none;
    color: var(--dark-gray);
}

.woocommerce table.shop_attributes td {
    padding: 10px 15px;
    border: none;
}

.woocommerce table.shop_attributes tr:nth-child(even) td,
.woocommerce table.shop_attributes tr:nth-child(even) th {
    background: transparent;
}

.woocommerce #review_form #respond p {
    margin: 0 0 20px;
}

.woocommerce p.stars a {
    color: var(--purple);
}

.woocommerce #review_form #respond textarea {
    width: 100%;
    background: #ffffff;
    border: 1px solid #cccccc;
    height: 100px;
    border-radius: 20px;
    padding: 20px;
    color: var(--dark-gray);
    font-size: 16px;
    outline: none !important;
}

.woocommerce #review_form #respond input {
    background: #ffffff;
    border: 1px solid #cccccc;
    width: 100%;
    height: 46px;
    border-radius: 40px;
    font-size: 16px;
    padding: 5px 20px;
    color: var(--dark-gray);
    outline: none !important;
}

.woocommerce #review_form #respond p.comment-form-cookies-consent {
    position: relative;
    padding-left: 20px;
}

.woocommerce #review_form #respond p.comment-form-cookies-consent input {
    width: auto;
    height: auto;
    position: absolute;
    top: 4px;
    left: 0;
}

.woocommerce #review_form #respond p.comment-form-cookies-consent label {
    margin-bottom: 0;
}

.woocommerce #review_form #respond .form-submit input {
    width: 170px;
    height: 46px;
    background: var(--purple);
    font-size: 16px;
    color: #ffffff;
    border: none;
    outline: none !important;
    border-radius: 40px;
    transition: 0.3s;
}

.woocommerce #review_form #respond .form-submit input:hover {
    background: var(--dark-gray);
    color: #ffffff;
}

.related.products h2 {
    font-size: 30px;
    margin-bottom: 30px;
}

.woocommerce div.product form.cart .variations {
    margin-bottom: 30px;
}

.woocommerce div.product form.cart .variations td,
.woocommerce div.product form.cart .variations th {
    width: 100%;
    display: block;
    position: relative;
}

.woocommerce div.product form.cart .variations td.label {
    padding: 0;
    line-height: 1;
}

.woocommerce div.product form.cart .variations select {
    min-width: unset;
    width: 300px;
    height: 46px;
    border: 1px solid #cccccc;
    border-radius: 40px;
    padding: 5px 20px;
    font-size: 16px;
    color: var(--dark-gray);
    outline: none !important;
    display: inline-block;
    margin-right: 20px;
    vertical-align: middle;
}

.woocommerce div.product form.cart .variations td.value:before {
    content: "\f078";
    position: absolute;
    top: 10px;
    left: 265px;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    top: 8px;
    font-size: 16px;
    color: var(--purple);
    pointer-events: none;
    z-index: 1;
}

.woocommerce div.product form.cart .reset_variations {
    display: inline-block;
    vertical-align: middle;
    padding: 11px 20px;
    height: 46px;
    background: rgba(0, 0, 0, 0.05);
    font-size: 16px;
    line-height: 26px;
    border-radius: 40px;
    color: var(--dakr-gray);
    transition: 0.3s;
}

.woocommerce div.product form.cart .reset_variations:hover {
    background: var(--purple);
    color: #ffffff;
}

.woocommerce-variation-price {
    margin-bottom: 15px;
}

/*========== Shop Detail Page CSS End ==========*/

/*========== Cart Page CSS Start ==========*/

.woocommerce table.shop_table {
    border: 1px solid #cccccc;
    border-radius: 10px;
    margin: 0;
    position: relative;
}

.woocommerce table.shop_table td {
    border-top: 1px solid #cccccc;
    padding: 15px;
}

.woocommerce table.shop_table tr {
    position: relative;
}

.woocommerce table.shop_table th.product-remove {
    width: 5%;
}

.woocommerce table.shop_table td.product-remove {
    width: 5%;
}

.woocommerce table.shop_table td.product-remove a.remove {
    width: 30px;
    height: 30px;
    padding: 0;
    background: var(--dark-gray);
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    text-align: center;
    color: #ffffff !important;
    border-radius: 0;
    font-size: 30px;
    line-height: 30px;
    font-weight: 400;
    padding-bottom: 3px;
    transition: 0.3s;
}

.woocommerce table.shop_table td.product-remove a.remove:hover {
    background: var(--purple);
    color: #ffffff !important;
}

.woocommerce table.shop_table th.product-thumbnail,
.woocommerce table.shop_table td.product-thumbnail {
    width: 15%;
}

.woocommerce table.shop_table td.product-thumbnail a {
    display: inline-block;
}

.woocommerce table.shop_table td.product-thumbnail a img {
    width: 80px;
    height: 80px;
    border-radius: 5px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
}

.woocommerce table.shop_table th.product-name,
.woocommerce table.shop_table td.product-name {
    width: 28%;
}

.woocommerce table.shop_table td.product-name a {
    font-size: 16px;
    color: var(--dark-gray);
    font-weight: 600;
    transition: 0.3s;
}

.woocommerce table.shop_table td.product-name a:hover {
    color: var(--purple);
}

.woocommerce table.shop_table th.product-price,
.woocommerce table.shop_table td.product-price {
    width: 20%;
}

.woocommerce table.shop_table th.product-quantity,
.woocommerce table.shop_table td.product-quantity {
    width: 12%;
}

.woocommerce table.shop_table th.product-subtotal,
.woocommerce table.shop_table td.product-subtotal {
    width: 20%;
}

.woocommerce table.shop_table td.product-price .woocommerce-Price-amount,
.woocommerce table.shop_table td.product-subtotal .woocommerce-Price-amount {
    font-size: 20px;
    color: var(--purple);
    font-weight: 700;
}

.woocommerce #content table.cart td.actions .input-text,
.woocommerce table.cart td.actions .input-text,
.woocommerce-page #content table.cart td.actions .input-text,
.woocommerce-page table.cart td.actions .input-text {
    width: 200px;
    height: 46px;
    border: 1px solid #cccccc !important;
    border-radius: 40px;
    padding: 5px 20px !important;
    font-size: 16px;
    color: var(--dark-gray);
    margin-right: 10px !important;
}

.woocommerce .cart-collaterals .cart_totals,
.woocommerce-page .cart-collaterals .cart_totals {
    float: none;
    width: 100%;
    background: #f7f6f7;
    padding: 20px;
    border-radius: 10px;
}

.woocommerce .cart-collaterals .cart_totals h2,
.woocommerce-page .cart-collaterals .cart_totals h2 {
    font-size: 25px;
    color: var(--dark-gray);
    margin-bottom: 15px;
}

#add_payment_method .cart-collaterals .cart_totals table,
.woocommerce-cart .cart-collaterals .cart_totals table,
.woocommerce-checkout .cart-collaterals .cart_totals table {
    border: none;
    border-radius: 0;
    margin: 0 0 30px 0;
}

#add_payment_method .cart-collaterals .cart_totals table th,
.woocommerce-cart .cart-collaterals .cart_totals table th,
.woocommerce-checkout .cart-collaterals .cart_totals table th {
    width: 40%;
    padding: 15px 0;
    display: inline-block;
}

#add_payment_method .cart-collaterals .cart_totals table td,
.woocommerce-cart .cart-collaterals .cart_totals table td,
.woocommerce-checkout .cart-collaterals .cart_totals table td {
    width: 60%;
    padding: 15px 0;
    text-align: right;
    display: inline-block;
}

#add_payment_method .wc-proceed-to-checkout,
.woocommerce-cart .wc-proceed-to-checkout,
.woocommerce-checkout .wc-proceed-to-checkout {
    padding: 0;
}

#add_payment_method .wc-proceed-to-checkout a.checkout-button,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
.woocommerce-checkout .wc-proceed-to-checkout a.checkout-button {
    width: 220px !important;
    max-width: 100% !important;
    background: var(--purple) !important;
    margin: auto;
}

#add_payment_method .wc-proceed-to-checkout a.checkout-button:hover,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover,
.woocommerce-checkout .wc-proceed-to-checkout a.checkout-button:hover {
    background: var(--dark-gray) !important;
}

.woocommerce table.shop_table tr.order-total .woocommerce-Price-amount {
    font-size: 20px;
    color: var(--purple);
}

#add_payment_method .cart-collaterals .cart_totals table td a.shipping-calculator-button,
.woocommerce-cart .cart-collaterals .cart_totals table td a.shipping-calculator-button,
.woocommerce-checkout .cart-collaterals .cart_totals table td a.shipping-calculator-button {
    font-size: 13px;
    color: var(--purple);
    transition: 0.3s;
}

#add_payment_method .cart-collaterals .cart_totals table td a.shipping-calculator-button:hover,
.woocommerce-cart .cart-collaterals .cart_totals table td a.shipping-calculator-button:hover,
.woocommerce-checkout .cart-collaterals .cart_totals table td a.shipping-calculator-button:hover {
    text-decoration: underline !important;
}

.shipping-calculator-form .form-row {
    margin-bottom: 10px !important;
    padding: 0 !important;
}

.shipping-calculator-form input,
.shipping-calculator-form select,
.shipping-calculator-form .select2-container--default .select2-selection--single {
    width: 100% !important;
    height: 30px !important;
    display: inline-block;
    border-radius: 40px !important;
    border: 1px solid #cccccc !important;
    padding: 5px 10px !important;
    font-size: 13px;
    text-align: left;
}

.shipping-calculator-form .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 30px;
    right: 5px;
}

.woocommerce .shipping-calculator-form .form-row .select2-container {
    line-height: inherit;
}

.shipping-calculator-form .select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 1;
    padding: 2px 0;
}

.woocommerce form .form-row#calc_shipping_state_field {
    display: block;
    width: 100%;
}

.shipping-calculator-form .button {
    max-width: 100% !important;
    height: 30px !important;
    padding: 0 !important;
    font-size: 14px !important;
}

.select2-container .select2-selection--single {
    height: 46px;
    border-radius: 40px;
    border: 1px solid #cccccc;
    padding: 8px 20px;
}

.select2-container .select2-selection--single .select2-selection__rendered {
    padding-left: 0;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 46px;
    right: 15px;
    top: 0;
}

.select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple,
.select2-container--default.select2-container--open.select2-container--below .select2-selection--single {
    border-bottom-left-radius: 40px;
    border-bottom-right-radius: 40px;
}

.select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple,
.select2-container--default.select2-container--open.select2-container--above .select2-selection--single {
    border-top-left-radius: 40px;
    border-top-right-radius: 40px;
}

.select2-container--open .select2-dropdown--below {
    border-top: 1px solid #aaa;
}

.select2-container--open .select2-dropdown--above {
    border-bottom: 1px solid #aaa;
}

/*========== Cart Page CSS End ==========*/

/*========== Checkout Page CSS Start ==========*/

.woocommerce form.checkout_coupon {
    background: #f7f6f7;
    border: none;
    border-radius: 10px;
    padding: 20px;
    margin: 30px 0;
}

.woocommerce form.checkout_coupon p {
    margin-bottom: 10px;
}

.woocommerce form.checkout_coupon .input-text,
.woocommerce form.login .input-text,
.woocommerce form.register .input-text {
    width: 100%;
    height: 46px;
    border-radius: 40px;
    border: 1px solid #cccccc;
    padding: 5px 20px;
    font-size: 16px;
    color: var(--dark-gray);
}

.woocommerce-account-fields .form-row {
    padding: 0 !important;
    margin-top: 10px !important;
}

.woocommerce form.checkout_coupon .form-row.form-row-first {
    width: 400px;
    max-width: 100%;
    margin-right: 15px;
    float: none;
    display: inline-block;
    margin-bottom: 0;
}

.woocommerce form.checkout_coupon .form-row.form-row-last {
    width: 170px;
    max-width: 100%;
    float: none;
    display: inline-block;
    margin-bottom: 0;
}

form.checkout.woocommerce-checkout .col-1,
form.checkout.woocommerce-checkout .col-2 {
    float: none;
    width: 100% !important;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    padding: 0;
}

.woocommerce-billing-fields h3,
h3#order_review_heading {
    font-size: 30px;
    margin-bottom: 20px;
}

.woocommerce-billing-fields__field-wrapper,
.woocommerce-additional-fields__field-wrapper,
.woocommerce-shipping-fields__field-wrapper {
    font-size: 0;
    line-height: 1;
    margin-left: -15px;
    margin-right: -15px;
}

form.checkout.woocommerce-checkout .form-row,
form.checkout.woocommerce-checkout .form-row.form-row-first,
form.checkout.woocommerce-checkout .form-row.form-row-last {
    float: none;
    width: 50% !important;
    display: inline-block;
    padding: 0 15px;
}

form.checkout.woocommerce-checkout .form-row label {
    display: block;
    width: 100%;
    margin-bottom: 0px;
}

form.checkout.woocommerce-checkout .form-row span.woocommerce-input-wrapper {
    display: block;
    width: 100%;
}

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea {
    width: 100%;
    height: 46px;
    border-radius: 40px;
    border: 1px solid #cccccc;
    padding: 5px 20px;
    color: var(--dark-gray);
}

.woocommerce-shipping-fields {
    margin-top: 30px;
}

.woocommerce-shipping-fields h3#ship-to-different-address {
    font-size: 20px;
}

.woocommerce-shipping-fields h3#ship-to-different-address input#ship-to-different-address-checkbox {
    margin-right: 5px;
}

.woocommerce-additional-fields {
    margin: 15px 0 30px;
}

.woocommerce form .form-row .input-text,
.woocommerce-page form .form-row .input-text {
    height: 120px;
    border-radius: 10px;
    padding: 20px;
    resize: none;
}

.woocommerce-checkout-review-order table.shop_table.woocommerce-checkout-review-order-table {
    margin-bottom: 30px;
}

#add_payment_method #payment,
.woocommerce-cart #payment,
.woocommerce-checkout #payment {
    background: #f7f6f7;
    border-radius: 10px;
}

#add_payment_method #payment a,
.woocommerce-cart #payment a,
.woocommerce-checkout #payment a {
    color: var(--purple);
    font-weight: 600;
    transition: 0.3s;
}

#add_payment_method #payment a:hover,
.woocommerce-cart #payment a:hover,
.woocommerce-checkout #payment a:hover {
    text-decoration: underline !important;
}

.woocommerce #payment #place_order,
.woocommerce-page #payment #place_order {
    float: none;
    width: 200px !important;
    max-width: 100% !important;
}

#add_payment_method #payment ul.payment_methods,
.woocommerce-cart #payment ul.payment_methods,
.woocommerce-checkout #payment ul.payment_methods,
#add_payment_method #payment div.form-row,
.woocommerce-cart #payment div.form-row,
.woocommerce-checkout #payment div.form-row {
    padding: 30px;
}

.woocommerce-order .woocommerce-customer-details {
    margin-bottom: 0 !important;
}

.woocommerce-order .woocommerce-customer-details .woocommerce-column--billing-address,
.woocommerce-order .woocommerce-customer-details .woocommerce-column--shipping-address {
    width: 100%;
    float: none;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    padding: 0;
}

.wc_payment_method img {
    width: 46px;
}

.payment_box .form-row {
    padding: 0 !important;
    margin-top: 20px !important;
    margin-bottom: 0 !important;
}

.payment_box.payment_method_eh_stripe_pay {
    padding: 30px 30px 20px 30px !important;
    background: #fff !important;
    box-shadow: 4px 4px 20px rgb(0 0 0 / 10%);
    border-radius: 15px !important;
}

#add_payment_method #payment div.payment_box::before,
.woocommerce-cart #payment div.payment_box::before,
.woocommerce-checkout #payment div.payment_box::before {
    border: 1em solid #fff;
    border-right-color: transparent;
    border-left-color: transparent;
    border-top-color: transparent;
}

#eh-stripe-card-element,
#eh-stripe-exp-element,
#eh-stripe-cvc-element {
    border-color: rgb(51 51 51 / 20%) !important;
}

/*========== Checkout Page CSS End ==========*/

/*========== Login Page CSS Start ==========*/

.login-box {
    width: 700px;
    max-width: 100%;
    padding: 40px;
    background: #f7f6f7;
    border-radius: 10px;
    display: block;
    margin: auto;
}

.login-box h2 {
    text-align: center;
    font-size: 30px;
    color: var(--dark-gray);
    margin-bottom: 20px;
}

.woocommerce form.login,
.woocommerce form.lost_reset_password,
.woocommerce form.checkout_coupon,
.woocommerce form.login,
.woocommerce form.register {
    border: 1px solid #cccccc;
    padding: 30px;
    margin: 0;
    border-radius: 10px;
}

.woocommerce form.login .form-row label {
    display: block;
    width: 100%;
    margin-bottom: 5px;
}

.woocommerce form.login .form-row label.woocommerce-form-login__rememberme {
    margin-bottom: 15px;
}

.woocommerce form.login .form-row span.password-input,
.woocommerce form.lost_reset_password .form-row-first {
    display: block;
    width: 100%;
}

.woocommerce form.login .form-row label.woocommerce-form-login__rememberme {
    margin-bottom: 15px;
}

.woocommerce-LostPassword.lost_password {
    margin-bottom: 0;
}

.woocommerce-LostPassword.lost_password a {
    font-size: 16px;
    color: var(--purple);
    transition: 0.3s;
}

.woocommerce-LostPassword.lost_password a:hover {
    text-decoration: underline !important;
}

.wpcf7 form.spam .wpcf7-response-output {
    color: #f56e28;
}

/*========== Login Page CSS End ==========*/

/*========== My Account Page CSS Start ==========*/

.woocommerce-account .woocommerce-MyAccount-navigation {
    font-size: 16px;
    line-height: 26px;
    width: 30%;
    padding-right: 30px;
    float: none;
    display: inline-block;
    vertical-align: top;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
    width: 100%;
    background: #f7f6f7;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li {
    display: block;
    border-bottom: 1px solid #dfdfdf;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li:last-child {
    border-bottom: none;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
    padding: 10px 20px;
    display: block;
    font-size: 16px;
    color: var(--dark-gray);
    font-weight: 600;
    position: relative;
    transition: 0.3s;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li a:before {
    content: "";
    position: absolute;
    top: 50%;
    right: -10px;
    transform: translate(0, -50%);
    width: 10px;
    height: 20px;
    border-left: 10px solid var(--purple);
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    opacity: 0;
    transition: 0.3s;
    z-index: 0;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover {
    background: rgba(0, 0, 0, 0.05);
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
    background: var(--purple);
    color: #ffffff;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a:before {
    opacity: 1;
}

.woocommerce-account .woocommerce-MyAccount-content {
    float: none;
    width: 69%;
    display: inline-block;
    font-size: 16px;
    line-height: 26px;
}

.woocommerce-account .woocommerce-MyAccount-content p a,
.woocommerce table.my_account_orders td.woocommerce-orders-table__cell-order-number a,
.woocommerce-account .addresses .title .edit,
.woocommerce table.shop_table.order_details td a {
    font-size: 16px;
    color: var(--purple);
    transition: 0.3s;
}

.woocommerce-account .woocommerce-MyAccount-content p a:hover,
.woocommerce table.my_account_orders td.woocommerce-orders-table__cell-order-number a:hover,
.woocommerce-account .addresses .title .edit:hover,
.woocommerce table.shop_table.order_details td a:hover {
    text-decoration: underline !important;
}

.woocommerce table.my_account_orders {
    font-size: 16px;
}

.woocommerce table.my_account_orders td.woocommerce-orders-table__cell-order-actions,
.woocommerce table.my_account_orders th.woocommerce-orders-table__header-order-actions {
    width: 235px;
}

.woocommerce table.my_account_orders .button {
    width: auto !important;
    height: auto !important;
    padding: 8px 15px !important;
    font-size: 14px !important;
    margin-right: 5px;
}

.woocommerce table.my_account_orders .button:last-child {
    margin-right: 0;
}

.woocommerce-account .woocommerce-MyAccount-content .col2-set .col-1,
.woocommerce-account .woocommerce-MyAccount-content .col2-set .col-1,
.woocommerce-account .woocommerce-MyAccount-content .col2-set .col-2,
.woocommerce-account .woocommerce-MyAccount-content .col2-set .col-2 {
    width: 100%;
    float: none;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
    padding: 0;
}

.woocommerce-account .woocommerce-MyAccount-content h2,
.woocommerce-account h3 {
    font-size: 30px;
    color: var(--dark-gray);
    margin-bottom: 15px;
}

.woocommerce .woocommerce-customer-details address {
    padding: 20px;
    border: 1px solid #cccccc;
    border-radius: 10px;
}

.woocommerce-column--billing-address {
    margin-bottom: 30px;
}

form#order_review table.shop_table {
    margin-bottom: 30px;
}

.woocommerce-address-fields__field-wrapper,
.woocommerce-EditAccountForm.edit-account {
    font-size: 0;
    line-height: 1;
    margin-left: -10px;
    margin-right: -10px;
    margin-bottom: 30px;
}

.woocommerce-address-fields__field-wrapper .form-row {
    width: 50% !important;
    display: inline-block;
    padding: 0 10px !important;
}

.woocommerce-EditAccountForm.edit-account {
    margin-bottom: 0;
}

.woocommerce-EditAccountForm.edit-account .woocommerce-Button.button {
    margin-top: 30px;
}

.woocommerce-EditAccountForm.edit-account .form-row {
    width: 100% !important;
    display: block;
    padding: 0 10px;
}

form.woocommerce-EditAccountForm.edit-account fieldset {
    padding: 0;
    margin-top: 30px;
}

form.woocommerce-EditAccountForm.edit-account fieldset legend {
    font-size: 25px;
    font-weight: 600;
    margin-bottom: 15px;
    color: var(--dark-gray);
}

form.woocommerce-EditAccountForm.edit-account fieldset label,
form.woocommerce-EditAccountForm.edit-account fieldset .password-input {
    display: block;
    width: 100%;
}

.woocommerce ul.order_details li {
    float: none;
    display: inline-block;
    margin-right: 20px;
    padding-right: 20px;
    font-size: 12px;
}

.woocommerce-order-details .order-again {
    margin-top: 20px;
}

.woocommerce table.shop_table.order_details .download-file .button {
    width: 150px !important;
    height: 35px !important;
    padding: 10px 5px !important;
    text-decoration: unset !important;
}

.woocommerce form .form-row label,
.woocommerce form .form-row span.password-input {
    width: 100%;
}

/*========== My Account Page CSS End ==========*/

/*========== 404 CSS Start ==========*/

.error-404 {
    padding: 80px 0 0;
    text-align: center;
}

.error-404 img {
    width: 50%;
    margin: auto;
}

/*========== 404 CSS End ==========*/

/*========== Thank You Page CSS Start ==========*/

.thank-text {
    text-align: center;
    padding-top: 170px;
    position: relative;
}

.thank-text:before {
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%);
    width: 147px;
    height: 151px;
    background-image: url("assets/images/thank-you.gif");
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 10px;
    overflow: hidden;
}

.thank-text h6 {
    text-transform: uppercase;
    color: var(--purple);
    font-weight: bold;
}

.thank-text p a {
    text-decoration: underline !important;
    color: var(--purple);
    transition: 0.3s;
    font-weight: bold;
}

.thank-text p a:hover {
    color: var(--dark-gray);
}

.inner-banner.blog-page {
    padding: 200px 0px 150px;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    position: relative;
}

.inner-banner.blog-page:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: linear-gradient(100deg, #ffffff, #ffffff);
    opacity: 0.9;
    pointer-events: none;
}

/*========== Thank You Page CSS End ==========*/

/*========== Inner Page CSS Start ==========*/

.main-banner.inner-banner.inner-page-banner {
    padding: 350px 0 150px 0;
    box-shadow: inset 0 0 10px #000000;
}

.inner-page-text {
    padding: 80px 0;
}

.privacy-title {
    font-size: 30px;
    line-height: 45px;
    color: #008ce9;
}

.privacy-content ol,
.privacy-content ul {
    padding: 0;
    margin: 0 0 1.5em 3em;
}

.privacy-content ol li,
.privacy-content ul li {
    margin-bottom: 10px;
    /* list-style: decimal; */
}

.privacy-content a {
    color: #008ce9;
    transition: 0.3s;
}

.privacy-content a:hover {
    color: #00223a;
}

.plugin-details .sec-btn:hover,
.donate .sec-btn.min-btn:hover {
    box-shadow: 0px 5px 10px rgb(0 0 0 / 15%);
    transition: 0.3s;
}

/*========== Inner Page CSS End ==========*/

/*========== Contact Us ==========*/

.main-banner.contact-us {
    background-repeat: no-repeat;
    padding: 200px 0px 150px;
    background-position: center;
    background-size: cover;
    position: relative;
    background-attachment: fixed;
    box-shadow: inset 0 0 10px #000000;
}

.main-banner.contact-us:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: linear-gradient(100deg, #ffffff, #ffffff);
    opacity: 0.9;
    pointer-events: none;
}

.contact-details {
    padding: 100px 0px;
    position: relative;
    background-color: #fff;
}

.contact-us-form {
    background: var(--purple);
    border-radius: 30px;
    padding: 60px;
    box-shadow: 0px 5px 10px rgb(0 0 0 / 15%);
}

.contact-us-form .wpcf7-form {
    overflow: visible;
}

.contact-details button.sec-btn.sm-btn {
    width: 170px;
    background: var(--dark-gray);
    border-color: var(--dark-gray);
}

.contact-details button.sec-btn.sm-btn:hover {
    background: #fff;
    color: var(--purple);
    border-color: #ffffff;
}

.search-form .wpcf7-response-output.wpcf7-display-none.wpcf7-validation-errors,
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output {
    display: none !important;
}

.search-form span.wpcf7-not-valid-tip {
    color: #fff;
}

/*========== Contact Us End ==========*/

/*========== Pagination ==========*/

.result-pagination {
    text-align: center;
    margin: 0 auto;
}

.result-pagination ul.page-numbers {
    margin-top: 60px;
}

.page-numbers {
    text-align: center;
}

.woocommerce nav.woocommerce-pagination ul li span,
.woocommerce nav.woocommerce-pagination ul li a {
    padding: 0;
}

.page-numbers li,
.woocommerce.woocommerce-page nav.woocommerce-pagination ul li {
    padding: 0;
    margin: 0;
    display: inline-block;
    overflow: hidden;
    color: var(--purple);
    margin-right: 10px;
    vertical-align: middle;
}

.page-numbers li:last-child,
.woocommerce.woocommerce-page nav.woocommerce-pagination ul li:last-child {
    margin-right: 0;
}

.page-numbers li .page-numbers,
.woocommerce.woocommerce-page nav.woocommerce-pagination ul li a,
.woocommerce.woocommerce-page nav.woocommerce-pagination ul li span {
    display: inline-flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    text-align: center;
    width: 40px;
    height: 40px;
    color: var(--purple);
    font-size: 25px;
    line-height: 26px;
    padding-bottom: 3px;
    border-radius: 8px;
    transition: 0.3s;
}

.page-numbers li .page-numbers.current,
.page-numbers li .page-numbers.current:hover,
.woocommerce.woocommerce-page nav.woocommerce-pagination ul li span.current,
.woocommerce.woocommerce-page nav.woocommerce-pagination ul li span.current:hover {
    color: #ffffff;
    background: var(--dark-gray);
}

.page-numbers li .page-numbers:hover,
.woocommerce nav.woocommerce-pagination ul li a:hover {
    background: var(--purple);
    color: #fff;
}

.page-numbers li.next-list-item a,
.page-numbers li.prev-list-item a {
    font-size: 20px;
    line-height: 38px;
    color: var(--dark-gray);
    transition: 0.3s;
}

.page-numbers li.next-list-item a:hover,
.page-numbers li.prev-list-item a:hover {
    color: var(--purple);
}

/*========== Pagination End ==========*/

/*========== all-creativelogos ==========*/

.all-creativelogos .theme-img {
    height: 250px;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.all-creativelogos .theme-details {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.all-creativelogos .theme-btn {
    position: absolute;
    bottom: -73%;
}

.all-creativelogos .theme-box:hover .theme-btn {
    bottom: 0;
    position: relative;
    transition: 0.3s;
}

.all-creativelogos .theme-box>a:hover .theme-details {
    background: var(--purple);
}

.logo-theme-banner .theme-slider {
    height: 500px;
}

.main-banner.single-theme.logo-theme-banner .banner-img {
    height: 500px;
}

.main-banner.single-theme.logo-theme-banner .banner-img img {
    height: 100%;
}

.all-creativelogos {
    margin-bottom: -30px;
}

.all-creativelogos.related-logo {
    margin-bottom: 0;
}

.all-creativelogos .theme-details {
    position: absolute;
    height: 70px;
    padding-top: 20px;
    padding-bottom: 20px;
    flex-wrap: wrap;
    flex-direction: row;
}

.all-creativelogos .theme-box:hover .theme-details {
    height: 100px;
}

.all-creativelogos .theme-box .theme-details .star-rating-wp .star-rating {
    opacity: 0;
}

.all-creativelogos .theme-box:hover .theme-details .star-rating-wp .star-rating {
    margin-top: 10px;
    opacity: 1;
}

.all-creativelogos .theme-btn {
    position: relative;
    bottom: 0;
}

.all-creativelogos .theme-btn a {
    margin-bottom: 0 !important;
}

.all-creativelogos .theme-details h3 {
    height: auto;
    -webkit-line-clamp: 1;
    margin-bottom: 0;
}

.all-creativelogos .theme-box {
    cursor: unset;
    box-shadow: 1px 1px 0 rgb(0 0 0 / 5%);
    transition: 0.4s;
    position: relative;
    top: 0;
}

.all-creativelogos .theme-box:hover {
    position: relative;
    top: -10px;
    box-shadow: 0px 20px 40px rgb(0 0 0 / 10%);
}

.row.all-creativelogos a.sec-btn.min-btn {
    margin-bottom: 6px !important;
}

.related-logo a.sec-btn.min-btn {
    margin-bottom: 13px !important;
}

/*========== all-creativelogos end ==========*/

/*========== no results Page Start ==========*/

.no-results.not-found {
    padding: 80px 0;
    text-align: center;
}

.no-results.not-found .page-content p {
    max-width: 380px;
    margin: 40px auto 30px;
}

/*========== no results Page end ==========*/

/*========== wp tab==========*/

.wp-tab-wp {
    margin: 20px 0;
}

.themes-list .wp-tab-wp {
    margin: 0px 0 50px;
}

.wp-tab-wp ul li a {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 8px 30px 6px;
    background: var(--dark-gray);
    color: #fff;
    text-transform: capitalize;
    transition: 0.3s;
    min-height: 36px;
    font-weight: bold;
    min-width: 100px;
}

.wp-tab-wp ul li {
    display: inline-block;
    border-right: 1px solid #fff;
}

.wp-tab-wp ul {
    display: flex;
    justify-content: center;
}

.wp-tab-wp ul li:first-child a {
    border-radius: 20px 0 0 20px;
}

.wp-tab-wp ul li:last-child a {
    border-radius: 0 20px 20px 0;
}

.wp-tab-wp ul li:last-child {
    border: none;
}

.wp-tab-wp ul li a:hover,
.wp-tab-wp a.wp-active-tab {
    background: var(--purple);
}

/*========== wp tab end ==========*/


/*========== Critical Announcement CSS Start ==========*/
.critical-announcement {
    width: 90%;
    max-width: 1110px;
    margin: 30px auto 20px;
    border-radius: 12px;
    background: #6659bf0f;
    overflow-x: hidden;
    text-align: left;
    color: var(--white-color);
    border: 1px solid var(--purple);
}

.critical-announcement .critical-announcement-header {
    display: inline-flex;
    align-items: baseline;
    width: 100%;
    padding: 15px 24px;
    background-color: #6659bf;
    font-weight: bold;
    color: var(--white-color);
    border-bottom: 1px solid #ffffff4d;
    gap: 15px;
}

.critical-announcement .critical-announcement-header i {
    font-size: 16px;
}

.critical-announcement .critical-announcement-header h5 {
    font-size: 18px;
    line-height: 1.5;
    color: var(--white-color);
    margin-bottom: 0;
}

.critical-announcement .critical-announcement-content {
    padding: 20px 24px;
    backdrop-filter: blur(15px);
}

.critical-announcement .critical-announcement-content p {
    color: var(--black-color);
}

.critical-announcement .critical-announcement-content p:last-child {
    margin-bottom: 0;
}

.critical-announcement .critical-announcement-content p a {
    color: var(--purple);
    font-weight: bold;
    text-decoration: underline !important;
}

.critical-announcement .critical-announcement-content p a:hover {
    color: var(--black-color);
}

@media screen and (max-width: 991px) {
    .critical-announcement {
        width: 100%;
        margin: 20px auto 10px;
    }

    .critical-announcement .critical-announcement-header {
        padding: 15px 20px;
        gap: 10px;
    }

    .critical-announcement .critical-announcement-header h5 {
        font-size: 16px;
    }

    .critical-announcement .critical-announcement-content {
        padding: 15px 20px;
    }
}

@media screen and (max-width: 575px) {
    .critical-announcement .critical-announcement-content p {
        font-size: 14px;
        margin-bottom: 8px;
    }
}

/*========== Critical Announcement CSS End ==========*/

/*========== Responsive Start ==========*/

@media screen and (min-width: 1500px) {
    .container {
        max-width: 1200px;
    }
}

@media screen and (max-height: 1200px) and (max-width: 1600px) {
    .tablet-landscape-device {
        width: 940px;
        height: 1200px;
        top: 50%;
        margin-top: -85px;
    }

    .show .tablet-landscape-device {
        transform: scale(0.8) rotate(90deg);
        transition: 0.6s ease-in;
    }

    .tablet-landscape-device iframe {
        top: 1163px;
        height: 900px;
        left: 30px;
        transform: rotate(-90deg) scale(0.938);
    }

    .tablet-device {
        width: 895px;
        height: 100vh;
        top: 60px;
    }

    .tablet-device iframe {
        position: relative;
        top: 33px;
        height: 100vh;
        left: 36px;
        width: 793px;
    }
}

@media screen and (max-height: 1024px) and (max-width: 1280px) {
    .tablet-landscape-device {
        height: 1080px;
        width: 850px;
        top: 0px;
        margin-top: -85px;
    }

    .show .tablet-landscape-device {
        transform: scale(0.8) rotate(90deg);
        transition: 0.6s ease-in;
    }

    .tablet-landscape-device iframe {
        top: 1047px;
        transform: rotate(-90deg) scale(0.85);
    }

    .tablet-device {
        top: 50px;
        width: 730px;
    }

    .tablet-device iframe {
        left: 29px;
        top: 34px;
        width: 720px;
        transform: scale(0.898);
    }
}

/* @media screen and (max-height: 960px) {
    .tablet-landscape-device {
        height: 960px;
        width: 760px;
        top: -50px;
    }
    .tablet-landscape-device iframe {
        top: 930px;
        transform: rotate(-90deg) scale(.8);
    }
    .tablet-device {
        width: 680px !important;
    }
    .tablet-device iframe {
        left: 27px !important;
        top: 25px !important;
        width: 603px !important;
        transform: scale(1) !important;
    }
}  */

@media screen and (max-height: 900px) and (max-width: 1440px) {
    .tablet-landscape-device {
        height: 900px;
        width: 715px;
        top: 0px;
        transform: rotate(90deg) scale(0.8);
    }

    .show .tablet-landscape-device {
        transform: scale(0.8) rotate(90deg);
        transition: 0.6s ease-in;
    }

    .tablet-landscape-device iframe {
        top: 873px;
        transform: rotate(-90deg) scale(0.71);
        height: 893px;
        left: 28px;
    }

    .mobile-landscape-device iframe {
        transform: rotate(-90deg) scale(1.01);
    }

    .tablet-device {
        height: 100vh;
        width: 669px;
    }

    .tablet-device iframe {
        left: 24px;
        width: 768px;
        height: 875px;
        top: 24px;
        transform: scale(0.78);
    }

    .mobile-device {
        width: 300px;
        height: 615px;
        top: 50px;
    }

    .mobile-device iframe {
        height: 691px;
        top: 28px;
        left: 18px;
        width: 320px;
        transform: scale(0.825);
    }

    .show .mobile-device {
        transform: scale(0.9) rotateY(0deg);
        transition: 0.6s ease-in;
    }
}

@media screen and (max-height: 768px) and (max-width: 1499px) {
    .tablet-landscape-device iframe {
        transform: rotate(-90deg) scale(0.586);
        position: relative;
        top: 606px;
        height: 748px;
        left: 17px;
        width: 1000px;
        max-width: initial;
        border-radius: 14px;
        transform-origin: top left;
        margin: 0;
        padding: 0;
    }

    .tablet-landscape-device {
        width: 490px;
        height: 100vh;
        transform: rotate(90deg);
        margin: 0 auto;
        position: relative;
        top: -40px;
    }
}

@media screen and (max-height: 768px) and (max-width: 1366px) {
    .tablet-landscape-device iframe {
        transform: rotate(-90deg) scale(0.644);
        position: relative;
        top: 745px;
        height: 838px;
        left: 24px;
        transform-origin: top left;
    }

    .tablet-landscape-device {
        width: 610px;
        height: 768px;
        transform: rotate(90deg) scale(0.8);
        margin: 0 auto;
        position: relative;
        top: -80px;
    }

    .tablet-device {
        width: 532px;
    }

    .tablet-device iframe {
        left: 21px;
        top: 18px;
        transform: scale(0.744);
        height: 104vh;
    }

    .mobile-device {
        height: 660px;
        width: 320px;
        top: -30px;
        transform: scale(0.8);
    }

    .mobile-device iframe {
        left: 18px;
        width: 320px;
        top: 30px;
        height: 685px;
        transform: scale(0.89);
    }
}

@media screen and (max-width: 1499px) {
    .banner-img {
        width: 55vw;
    }

    .main-navigation li a {
        padding: 30px 20px;
    }

    .plugin-box h4 {
        font-size: 23px;
    }

    .sticky_head .main-navigation li a {
        padding: 20px;
        transition: 0.5s;
    }

    .theme-img {
        height: 425px;
    }

    .btn-wp .sec-btn:last-of-type {
        margin-left: 15px !important;
        margin-right: 0 !important;
    }

    .btn-wp form.cart .sec-btn {
        margin: 0 !important;
    }

    .btn-wp .sec-btn:first-child {
        margin-right: 15px !important;
        margin-left: 0 !important;
    }

    .plugin-details ul li .star-rating-wp .star-rating,
    .plugin-details ul li .star-rating .star-rating__fill {
        font-size: 26px;
    }

    .banner-bg-icons .icon.two {
        left: 10%;
    }

    .banner-bg-icons .icon.three {
        left: 2%;
    }

    .banner-bg-icons .icon.four {
        right: 10%;
    }

    .banner-bg-icons .icon.six {
        right: 8%;
    }
}

@media screen and (max-width: 1440px) {
    .single-plugin .banner-img img {
        height: 540px;
    }

    .single-plugin .banner-img {
        width: 550px;
    }
}

@media screen and (max-width: 1366px) {
    .preview-devices ul li.preview-tab1 {
        display: none;
    }
}

@media screen and (max-width: 1199px) {

    /* .main-navigation li a {
        padding: 30px 14px;
    } */
    .sticky_head .main-navigation li a {
        padding: 20px 15px;
    }

    .btn-wp {
        margin-top: 20px;
    }

    .login.sec-btn {
        margin-left: 15px;
    }

    .h1-title {
        font-size: 43px;
        line-height: 53px;
    }

    .search-section .sec-btn {
        flex: 0 0 21.314%;
    }

    .plugin-box {
        padding: 35px 20px;
    }

    .wordpress-plugin .banner-img img {
        width: 570px;
        height: auto;
    }

    .plugin-details,
    .donate {
        margin-left: 5px;
    }

    .theme-details {
        padding: 17px 20px;
    }

    .theme-box:hover .theme-details {
        padding: 23px 20px;
    }

    .theme-slider {
        transform: scale(0.7);
        position: absolute;
        left: 0;
        top: 0;
    }

    .single-theme .banner-content {
        padding-left: 0px;
    }

    .specification-box {
        padding: 20px 10px;
    }

    .footer-bottom-link li {
        padding: 0 8px;
    }

    .main-navigation li {
        margin-right: 0px;
    }

    .woocommerce table.shop_table td {
        padding: 15px 10px;
    }

    #add_payment_method .wc-proceed-to-checkout a.checkout-button,
    .woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
    .woocommerce-checkout .wc-proceed-to-checkout a.checkout-button {
        font-size: 14px !important;
    }

    .theme-img {
        height: 350px;
    }

    .btn-wp .sec-btn {
        padding: 10px 15px;
    }

    .features p {
        font-size: 14px;
    }

    .banner-bg-icons .icon.one {
        width: 60px;
    }

    .banner-bg-icons .icon.two {
        width: 40px;
    }

    .banner-bg-icons .icon.three {
        width: 50px;
    }

    .banner-bg-icons .icon.four {
        right: 7%;
        width: 40px;
    }

    .banner-bg-icons .icon.five {
        width: 50px;
    }

    .banner-bg-icons .icon.six {
        right: 5%;
        width: 40px;
    }
}

@media (min-width: 991px) {
    .plugin-bg {
        min-height: 290px;
        width: 100%;
    }
}

@media screen and (max-width: 991px) {
    .site-header .container {
        padding: 0px 30px;
        max-width: 100%;
    }

    .for-des,
    .banner-bg-icons {
        display: none !important;
    }

    .for-mob {
        display: block !important;
    }

    .site-header {
        top: 0px;
        width: 100%;
        height: 80px;
        position: fixed;
        border-radius: 0px;
        z-index: 9;
        transition: 0.3s;
        /* background-color: #fff; */
    }

    .sticky_head.site-header:before {
        opacity: 1;
        background: #fff;
    }

    .site-branding {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        align-content: center;
        justify-content: center;
        align-items: center;
        position: absolute;
        top: 50%;
        left: 15px;
        z-index: 9;
        width: 180px;
        height: 80px;
        margin: 0;
        transform: translate(0);
    }

    nav.main-navigation {
        height: 80px;
    }

    .login.sec-btn,
    .header-cart,
    a.login {
        width: auto;
        height: auto;
        transform: none;
        display: flex;
        z-index: 2;
        margin: 0px;
        padding: 5px;
        border-radius: 10px;
        background: transparent;
        border-color: transparent;
        color: var(--dark-gray);
        transition: 0.5s;
        box-shadow: none;
        justify-content: center;
        align-items: center;
    }

    .header-right a.login:hover {
        background-color: transparent;
        color: var(--purple);
    }

    .menu-toggle {
        padding: 0;
        margin: 0;
        border: none;
        width: 50px;
        height: 50px;
        display: block;
        position: absolute;
        right: 0;
        top: 50%;
        transform: translate(0, -50%);
        border-radius: 10px;
        outline: none !important;
        background: var(--dark-gray);
        z-index: 99;
        box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
        transition: 0.5s;
    }

    nav.main-navigation .menu-menu-container {
        height: 100vh;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        transition: 1s cubic-bezier(0.165, 0.84, 0.44, 1);
        overflow: hidden;
        transform: translatey(-100%);
        background: #fff;
        padding: 20px 30px;
        display: flex;
        align-items: center;
        flex-direction: column;
        z-index: 9;
    }

    .menu.nav-menu {
        height: 100vh;
        display: flex !important;
        width: 100%;
        padding-top: 10vh;
        flex-direction: column;
    }

    nav.main-navigation .menu.nav-menu li {
        display: inline-block;
        text-align: left;
        margin: 0;
        margin-bottom: 5vh;
    }

    nav.main-navigation .menu.nav-menu li:last-child {
        margin-bottom: 0;
    }

    .main-navigation.toggled .menu-menu-container {
        transform: translatey(0);
    }

    .sticky-header {
        background: #fff;
    }

    .search-icon i {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        color: #fff;
    }

    .search-icon i:hover {
        color: var(--dark-gray);
        transition: 0.5s;
    }

    a.search-icon {
        display: none;
    }

    .menu-toggle span {
        width: 35px;
        height: 4px;
        background: var(--purple);
        position: absolute;
        top: 50%;
        border-radius: 20px;
        z-index: 1;
        transition: 0.3s all;
        left: 50%;
        opacity: 1;
        transform: translate(-50%, -50%);
    }

    .menu-toggle span:first-child {
        width: 30px;
        opacity: 1;
        margin: 7px 0px;
        border-radius: 0px 0px 10px 10px;
        background: #fff;
    }

    .menu-toggle span:last-child {
        width: 30px;
        opacity: 1;
        margin: -7px 0px;
        border-radius: 10px 10px 0px 0px;
        background: #fff;
    }

    .site-header:before {
        content: "";
        display: block;
        position: absolute;
        height: 100%;
        width: 100%;
        top: 0;
        left: 0;
    }

    .sticky_head .site-branding {
        width: 180px;
        height: 60px;
    }

    .menu-toggle,
    .sticky_head .menu-toggle {
        width: 45px;
        height: 45px;
    }

    .sticky_head .toggled .menu-toggle span:last-child {
        left: 17%;
    }

    .sticky_head .toggled .menu-toggle span:first-child {
        left: 17%;
    }

    .sticky_head .main-navigation li a,
    .main-navigation li a {
        padding: 0;
        font-size: 20px;
        display: inline-block;
    }

    .main-navigation ul>li.menu-item-has-children:after {
        right: -15px;
        top: 10px;
        font-size: 18px;
    }

    .toggled .menu-toggle span {
        opacity: 0;
    }

    .toggled .menu-toggle span:first-child {
        transform: rotate(-45deg);
        opacity: 1;
        margin: 0px;
        width: 30px;
        left: 20%;
        top: 45%;
        border-radius: 10px;
    }

    .toggled .menu-toggle span:last-child {
        transform: rotate(45deg);
        width: 30px;
        opacity: 1;
        left: 20%;
        top: 45%;
        border-radius: 10px;
        margin: 0;
    }

    .price-gcl {
        display: block;
    }

    .header-right {
        margin: 0;
        position: relative;
        right: 60px;
        transform: scale(1.2);
    }

    .header-cart {
        margin: 0;
    }

    .header-cart {
        transform: scale(0.9);
    }

    .cart-item-number {
        width: 12px;
        height: 12px;
        top: 0;
        right: 0;
        font-size: 10px;
    }

    .login.sec-btn i {
        margin-left: 0;
    }

    .header-cart svg path,
    .header-cart svg circle {
        fill: var(--dark-gray);
    }

    nav.main-navigation .menu-menu-container:before {
        content: "";
        display: block;
        position: absolute;
        right: 0;
        width: 129px;
        height: 1100px;
        top: 100%;
        transition: 1s cubic-bezier(0.165, 0.84, 0.44, 1);
        transition-duration: 3s;
        transform: translate(0, -50%);
        background-image: url(assets/images/before-logo.svg);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        opacity: 0.3;
        pointer-events: none;
    }

    nav.main-navigation.toggled .menu-menu-container:before {
        top: 50%;
        transition: 1s cubic-bezier(0.165, 0.84, 0.44, 1);
        transition-duration: 3s;
    }

    .main-navigation ul>li.current-menu-item.active-sub-menu::after {
        transform: translate(0, -50%) rotate(180deg);
        color: var(--dark-gray);
    }

    .main-navigation ul>li.menu-item-has-children::after {
        transform: translate(0, -50%) rotate(0deg) !important;
    }

    .main-navigation ul>li.active-sub-menu:after {
        transform: translate(0, -50%) rotate(180deg) !important;
    }

    .banner-img {
        position: relative;
        top: 0;
        width: 100%;
        height: 100%;
        margin-top: 60px;
    }

    .main-banner,
    .main-banner.wordpress-plugin,
    .main-banner.wordpress-themes {
        padding: 150px 0px 165px;
        text-align: center;
    }

    .main-banner.wordpress-plugin .banner-content p,
    .main-banner.wordpress-themes .banner-content p {
        margin: 25px 0px 0;
        font-size: 17px;
    }

    .banner-img img {
        height: auto;
    }

    .search-items {
        margin-bottom: -225px;
    }

    .pt-for-search {
        padding-top: 297px !important;
    }

    .search-form-box {
        height: 310px;
    }

    .search-section {
        flex-direction: column;
        width: 100%;
    }

    .search-input span.search-icon {
        display: none;
    }

    .search-input {
        background: unset;
        padding-left: 0;
    }

    input.form-input {
        background: rgb(255 255 255 / 0.2);
    }

    .modal-body.overflow-text .form-input {
        background: #ffffff;
    }

    .contact-us-form input.form-input {
        background-color: #fff;
    }

    .search-section .form-input {
        margin-bottom: 25px;
        padding: 0px 20px;
        border-radius: 30px;
    }

    .search-select.form-element .form-input {
        border: none;
        border-radius: 30px;
        width: 400px;
        max-width: 100%;
        padding: 0 20px;
    }

    .search-section .sec-btn {
        border-radius: 40px;
    }

    .wp-plugins,
    .wp-plugins-list,
    .themes-list,
    .about-plugin,
    .about-theme {
        padding: 72px 0 80px 0;
    }

    .themes {
        padding-bottom: 80px;
    }

    .themes-part .row {
        margin-bottom: 72px;
    }

    .textimonial {
        padding: 72px 0px 185px;
    }

    .footer-logo a {
        width: 120px;
        height: 120px;
    }

    .footer-menu.main-navigation {
        margin: 30px 0 15px 0;
    }

    .footer-menu.main-navigation li {
        margin: 0 15px 15px 15px;
    }

    .footer-bottom {
        text-align: center;
    }

    .copyright-left-text,
    .footer-bottom-link {
        margin-bottom: 15px;
    }

    .footer-bottom-link {
        margin-top: 5px;
    }

    .social-icon {
        text-align: center;
    }

    .themes-part .theme-img {
        height: auto;
        margin-bottom: 35px;
    }

    .theme-img {
        height: 400px;
    }

    .search-form .search-field {
        padding: 15px 50px 12px 30px;
        margin-top: 8px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    .main-navigation ul li>ul,
    .main-navigation ul li.focus>ul,
    .main-navigation ul ul {
        width: 100%;
        top: 0;
        left: 0;
        transform: translate(0, 0) scale(1);
        transition: 0.5s;
        box-shadow: none;
        position: relative;
        opacity: 1;
        background-color: transparent;
        padding-left: 15px !important;
        display: none;
    }

    .main-navigation ul ul {
        transform: translate(-50%, 0) scale(0);
    }

    .main-navigation li a:before,
    .main-navigation li a:after {
        display: none;
    }

    nav.main-navigation .menu.nav-menu li ul {
        padding-top: 10px;
    }

    .main-navigation ul.sub-menu li a {
        font-size: 16px;
    }

    .main-navigation ul.sub-menu li:last-child a {
        padding-bottom: 0 !important;
    }

    nav.main-navigation .menu.nav-menu li ul li {
        width: 100%;
        margin-bottom: 0;
    }

    .main-navigation ul ul a {
        font-size: 16px;
        padding: 10px 0 !important;
    }

    /* Plugin - Page */
    .wordpress-plugin .banner-img {
        width: 100%;
    }

    .single-plugin .banner-img img {
        width: 100%;
        height: auto;
    }

    .wordpress-plugin .banner-img img {
        width: 100%;
        max-width: 420px;
    }

    .main-banner .banner-content,
    .main-banner.single-plugin .banner-content {
        padding: 0;
    }

    .main-banner.single-plugin {
        padding: 130px 0px 80px;
    }

    .theme-slider {
        position: relative;
        transform: scale(1);
    }

    .main-banner.single-theme .banner-content {
        padding-top: 0;
    }

    .banner-content {
        position: relative;
        height: 100%;
        padding: 0px;
    }

    .mobile-view,
    .tablet-view {
        position: relative;
    }

    .tablet-view {
        top: 95px;
        left: -100px;
    }

    .about-theme-content {
        padding-bottom: 60px;
    }

    .second-img {
        left: 0;
        position: relative;
        top: 0;
        margin: 0 auto;
        margin-top: -100px;
    }

    .theme-img.odd,
    .theme-img.even {
        margin: 0 0 50px;
    }

    .theme-img.even .second-img {
        right: 0;
        left: 0;
        position: relative;
    }

    .theme-overview .themes-part .row {
        margin: 0px;
    }

    .theme-overview .themes-part .row .col-lg-6 {
        padding-bottom: 50px;
    }

    .contact-us-form {
        padding: 30px;
    }

    .main-banner.contact-us,
    .inner-banner.blog-page {
        padding: 150px 0 100px 0;
        background-attachment: unset;
    }

    .main-banner.single-theme.logo-theme-banner .banner-img {
        height: 100%;
    }

    .main-banner.single-theme.logo-theme-banner .banner-img img {
        height: auto;
    }

    .logo-theme-banner .banner-content {
        padding-top: 50px !important;
    }

    .all-creativelogos .theme-box {
        height: auto;
    }

    .plugin-details {
        margin-top: 30px;
    }

    .screenshot-section {
        padding-top: 72px;
        margin-bottom: 320px;
    }

    .screenshot-section .slick-dotted.slick-slider,
    .screenshot-slider {
        margin-bottom: -240px;
    }

    .screenshot-slider .slick-dots {
        bottom: -66px;
    }

    .woocommerce ul.products li.product,
    .woocommerce-page ul.products li.product {
        width: 50%;
    }

    .woocommerce-product-gallery.woocommerce-product-gallery--with-images.woocommerce-product-gallery--columns-4.images {
        width: 100%;
        margin-bottom: 20px;
    }

    .woocommerce #content div.product div.summary,
    .woocommerce div.product div.summary,
    .woocommerce-page #content div.product div.summary,
    .woocommerce-page div.product div.summary {
        float: none;
        width: 100%;
        padding-left: 0;
        margin-bottom: 60px;
    }

    .woocommerce-tabs.wc-tabs-wrapper {
        margin-bottom: 60px;
    }

    .woocommerce .cart-collaterals .cart_totals,
    .woocommerce-page .cart-collaterals .cart_totals {
        margin-top: 30px;
    }

    .woocommerce table.shop_table td.product-price .woocommerce-Price-amount,
    .woocommerce table.shop_table td.product-subtotal .woocommerce-Price-amount {
        font-size: 18px;
    }

    form.checkout.woocommerce-checkout .form-row,
    form.checkout.woocommerce-checkout .form-row.form-row-first,
    form.checkout.woocommerce-checkout .form-row.form-row-last,
    .woocommerce-address-fields__field-wrapper .form-row {
        width: 100% !important;
    }

    .woocommerce-account .woocommerce-MyAccount-navigation {
        width: 100%;
        padding-right: 0;
        margin-bottom: 40px;
    }

    .woocommerce-account .woocommerce-MyAccount-navigation ul li a:before {
        display: none;
    }

    .woocommerce-account .woocommerce-MyAccount-content {
        width: 100%;
    }

    .woocommerce ul.order_details li {
        display: block;
        margin-right: 0;
        padding-right: 0;
        border-right: none;
        border-bottom: 1px dashed #d3ced2;
        padding-bottom: 20px;
        margin-bottom: 20px;
        text-align: center;
    }

    .woocommerce ul.order_details li:last-child {
        padding-bottom: 0;
        margin-bottom: 0;
    }

    .main-banner.wordpress-plugin .banner-content,
    .main-banner.wordpress-themes .banner-content {
        padding: 0;
    }

    .plugin-features {
        padding: 72px 0px 50px;
    }

    .btn-wp .sec-btn {
        padding: 10px 30px;
        margin-right: 30px !important;
    }

    .btn-wp .sec-btn:last-child {
        margin: 0 !important;
    }

    .theme-overview.graphic-template-overview {
        margin-bottom: 50px;
    }

    .preview-header {
        height: 60px;
    }

    .preview-header .container {
        max-width: 100%;
        padding: 0 30px;
    }

    .preview-devices {
        position: absolute;
        top: 0;
        left: 50%;
        transform: translate(-50%);
        height: 60px;
        z-index: 100;
    }

    .preview-devices ul {
        height: 60px;
    }

    .preview-header .site-branding {
        position: absolute;
        top: 0;
        left: 15px;
        width: 100px;
        height: 60px;
        justify-content: flex-start;
    }

    .preview-header .site-branding a {
        width: 50px;
    }

    .preview-header-btn {
        position: absolute;
        top: 0;
        right: 15px;
        height: 60px;
    }

    .preview-header-btn .sec-btn {
        margin-right: 15px;
    }

    .preview-header-btn .sec-btn.min-btn {
        display: none;
    }

    .preview {
        top: 60px;
        height: calc(100vh - 60px);
    }

    .contact-details {
        padding: 80px 0;
    }

    .preview-devices ul li.preview-tab2 {
        display: none;
    }

    .btn-wp {
        justify-content: center;
    }

    .main-banner .btn-wp form.cart .sec-btn {
        margin-left: 10px !important;
        margin-right: 10px !important;
    }

    .login-box {
        margin-bottom: 30px;
    }

    .main-plugins-videos {
        padding: 72px 0 80px 0;
    }

    .plugins-videos-slider .plugins-img {
        height: 400px;
    }

    .plugin-video-thumbnail-box {
        height: 80px;
    }

    .features-box-text {
        padding: 30px 0 0 0;
    }
}

@media screen and (max-width: 768px) {

    .woocommerce ul.products li.product,
    .woocommerce-page ul.products li.product,
    .woocommerce ul.products[class*="columns-"] li.product,
    .woocommerce-page ul.products[class*="columns-"] li.product {
        width: 100%;
        float: none;
        margin-bottom: 30px;
    }

    .woocommerce table.shop_table {
        border: none;
        border-radius: 0;
    }

    .woocommerce table.shop_table tr.cart_item {
        background: #f7f6f7;
        border-radius: 10px 0 10px 10px;
        margin-bottom: 60px;
    }

    .woocommerce table.shop_table tr.cart_item:last-child {
        margin-bottom: 30px;
    }

    .woocommerce table.shop_table tr.cart_item td {
        border: none;
        border-bottom: 1px solid #dddddd;
        padding: 20px 30px;
    }

    .woocommerce table.shop_table tr.cart_item td:last-child {
        border: none;
    }

    .woocommerce table.shop_table td.product-remove,
    .woocommerce table.shop_table tr.cart_item td.product-remove {
        position: absolute;
        top: -30px;
        right: 0;
        width: auto;
        padding: 0;
        border: none;
    }

    .woocommerce table.shop_table th.product-name,
    .woocommerce table.shop_table td.product-name,
    .woocommerce table.shop_table th.product-price,
    .woocommerce table.shop_table td.product-price,
    .woocommerce table.shop_table th.product-quantity,
    .woocommerce table.shop_table td.product-quantity,
    .woocommerce table.shop_table th.product-subtotal,
    .woocommerce table.shop_table td.product-subtotal {
        width: 100%;
    }

    .woocommerce table.shop_table td.actions {
        padding: 20px 30px;
    }

    .woocommerce #content table.cart td.actions .coupon,
    .woocommerce table.cart td.actions .coupon,
    .woocommerce-page #content table.cart td.actions .coupon,
    .woocommerce-page table.cart td.actions .coupon {
        padding-bottom: 20px;
    }

    .woocommerce #content table.cart td.actions .input-text,
    .woocommerce table.cart td.actions .input-text,
    .woocommerce-page #content table.cart td.actions .input-text,
    .woocommerce-page table.cart td.actions .input-text,
    #add_payment_method .wc-proceed-to-checkout a.checkout-button,
    .woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
    .woocommerce-checkout .wc-proceed-to-checkout a.checkout-button {
        width: 100% !important;
        margin-bottom: 20px !important;
        margin-right: 0 !important;
    }

    .woocommerce #content table.cart td.actions .button,
    .woocommerce table.cart td.actions .button,
    .woocommerce-page #content table.cart td.actions .button,
    .woocommerce-page table.cart td.actions .button {
        width: 100% !important;
    }

    .woocommerce-page table.cart td.actions {
        border: none;
        border-radius: 10px;
        background: #f7f6f7;
        margin-top: -30px;
    }

    #add_payment_method .cart-collaterals .cart_totals table td,
    .woocommerce-cart .cart-collaterals .cart_totals table td,
    .woocommerce-checkout .cart-collaterals .cart_totals table td {
        width: 100%;
        padding: 20px 0;
    }

    .woocommerce .cart-collaterals .cart_totals,
    .woocommerce-page .cart-collaterals .cart_totals {
        padding: 30px;
    }

    .woocommerce table.shop_table_responsive tr:nth-child(2n) td,
    .woocommerce-page table.shop_table_responsive tr:nth-child(2n) td {
        background-color: #f7f6f7;
    }

    .woocommerce table.shop_table.shop_table_responsive tr.cart_item:nth-child(2n) td {
        background-color: transparent !important;
    }

    #add_payment_method .cart-collaterals .cart_totals table,
    .woocommerce-cart .cart-collaterals .cart_totals table,
    .woocommerce-checkout .cart-collaterals .cart_totals table {
        margin: 0 0 10px 0;
    }

    #add_payment_method .wc-proceed-to-checkout a.checkout-button,
    .woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
    .woocommerce-checkout .wc-proceed-to-checkout a.checkout-button {
        margin-bottom: 0 !important;
    }

    .woocommerce table.shop_table_responsive tr td::before,
    .woocommerce-page table.shop_table_responsive tr td::before {
        margin-right: 10px;
    }

    #add_payment_method .cart-collaterals .cart_totals table th,
    .woocommerce-cart .cart-collaterals .cart_totals table th,
    .woocommerce-checkout .cart-collaterals .cart_totals table th {
        display: none;
    }

    .woocommerce-checkout-review-order table.shop_table.woocommerce-checkout-review-order-table {
        background: #ffffff;
        border: 1px solid #cccccc;
        border-radius: 10px;
    }

    .woocommerce-checkout-review-order table.shop_table.woocommerce-checkout-review-order-table tr.cart_item {
        background: transparent;
        margin: 0;
    }

    .woocommerce-checkout-review-order table.shop_table.woocommerce-checkout-review-order-table tr.cart_item td {
        border-bottom: 0;
        padding: 15px 12px;
        border-top: 1px solid #cccccc;
    }

    .woocommerce table.my_account_orders tr.order {
        background: #f7f6f7;
        border-radius: 10px;
        margin-bottom: 30px;
    }

    .woocommerce table.my_account_orders tr.order:last-child {
        margin-bottom: 0;
    }

    .woocommerce table.my_account_orders td.woocommerce-orders-table__cell-order-actions,
    .woocommerce table.my_account_orders th.woocommerce-orders-table__header-order-actions {
        width: 100%;
    }

    .woocommerce table.my_account_orders tr:nth-child(2n) td {
        background-color: transparent;
    }

    .woocommerce table.my_account_orders tr td:first-child {
        border-top: none;
    }

    table.woocommerce-table.woocommerce-table--order-details.shop_table.order_details,
    form#order_review table.shop_table,
    .woocommerce table.shop_table.order_details {
        border: 1px solid #cccccc;
        border-radius: 10px;
    }
}

@media screen and (max-width: 767px) {
    .search-form {
        position: relative;
        width: 100%;
        margin: 0 auto;
    }

    .search-form .ajax-loader {
        bottom: -24px;
        top: auto;
        left: 50%;
        margin: 0;
        transform: translate(-50%, 0);
    }

    .banner-img {
        margin-top: 40px;
    }

    .product-updates {
        height: auto;
        padding: 30px;
    }

    .h2-title {
        font-size: 30px;
        line-height: 40px;
    }

    .line {
        width: 150px;
        margin: 10px auto;
    }

    .line:after {
        width: 75px;
    }

    .wp-plugins,
    .wp-plugins-list,
    .themes-list,
    .about-plugin,
    .about-theme {
        padding: 52px 0 60px 0;
    }

    .pt-for-search {
        padding-top: 277px !important;
    }

    .plugin-box {
        padding: 35px 30px;
    }

    .wp-plugins .sec-btn.view-more {
        margin-top: 40px;
    }

    .sec-btn.view-more {
        margin-top: 10px;
    }

    .wp-plugins .title p,
    .wp-plugins-list .title p {
        margin-bottom: -8px;
    }

    .themes-list .title {
        padding-bottom: 20px;
    }

    .themes {
        padding-bottom: 60px;
    }

    .theme-title {
        padding: 5px 30px;
        min-height: 50px;
    }

    .theme-title .h2-title {
        font-size: 25px;
        line-height: 38px;
    }

    .themes-part .line {
        margin: 10px 0 42px;
    }

    .themes-part .theme-img {
        margin-bottom: 25px;
    }

    .themes-part .overflow-text {
        margin-bottom: 26px;
    }

    .themes-part .row {
        margin-bottom: 52px;
    }

    .theme-box {
        width: 370px;
        max-width: 100%;
        margin: 0 auto 30px auto;
    }

    .theme-img {
        height: 450px;
    }

    .textimonial {
        padding: 52px 0px 165px;
    }

    .footer-logo {
        margin-top: 60px;
    }

    .second-img {
        display: none;
    }

    .error-404 img {
        width: 100%;
    }

    .plugins-img {
        height: 320px;
        margin-top: 42px;
    }

    .testimonials-slider {
        margin-top: 41px;
    }

    .features-list {
        padding-top: 33px;
    }

    .screenshot-slider {
        height: 320px;
        border: 15px solid var(--purple);
        margin-top: 32px;
    }

    .screenshot-img {
        height: 290px;
    }

    .screenshot-section .slick-dotted.slick-slider,
    .screenshot-slider {
        margin-bottom: -160px;
    }

    .screenshot-section {
        margin-bottom: 220px;
        padding-top: 52px;
    }

    .screenshot-slider .slick-dots {
        bottom: -61px;
    }

    .plugin-box h4 {
        display: block;
        height: auto;
    }

    .inner-page-text {
        padding: 60px 0;
    }

    .product-tab.dropdown .dropdown-toggle {
        display: block;
        width: 100%;
        text-align: left;
        padding: 11px 20px;
    }

    .product-tab.dropdown .dropdown-toggle:after {
        display: none;
    }

    .product-tab.dropdown .dropdown-toggle .dropdown-arrow {
        position: absolute;
        top: 12px;
        right: 20px;
        pointer-events: none;
        font-size: 16px;
        color: #ffffff;
        overflow: hidden;
    }

    .woocommerce-categories.dropdown-menu {
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background: #ffffff;
        border-radius: 10px;
        box-shadow: 0 10px 30px rgb(0 0 0 / 10%);
        overflow: hidden;
        display: none;
        z-index: 10;
    }

    .dropdown.show .woocommerce-categories.dropdown-menu {
        display: block;
    }

    .woocommerce-categories.dropdown-menu li {
        display: block;
        margin: 0;
        border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    }

    .woocommerce-categories.dropdown-menu li:last-child {
        border-bottom: none;
    }

    .woocommerce-categories.dropdown-menu li a {
        padding: 10px 20px;
        background: transparent;
        display: block;
        width: 100%;
        border-radius: 0;
    }

    .woocommerce-categories.dropdown-menu li a:hover {
        background: transparent;
        color: var(--purple);
    }

    .woocommerce div.product div.images .woocommerce-product-gallery__wrapper,
    .woocommerce div.product div.images .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image {
        height: 320px;
    }

    .woocommerce div.product div.images .flex-control-thumbs li img {
        height: 80px;
    }

    .woocommerce-error,
    .woocommerce-info,
    .woocommerce-message {
        padding: 20px 20px 85px 50px;
    }

    .woocommerce-error a,
    .woocommerce-info a,
    .woocommerce-message a {
        top: auto;
        right: auto;
        transform: none;
        bottom: 20px;
        left: 20px !important;
        text-align: left;
    }

    .woocommerce form.checkout_coupon .form-row.form-row-first {
        width: 100%;
        margin-right: 0;
        margin-bottom: 15px;
    }

    .woocommerce-error a.showcoupon,
    .woocommerce-info a.showcoupon,
    .woocommerce-message a.showcoupon,
    .woocommerce-error a.restore-item,
    .woocommerce-info a.restore-item,
    .woocommerce-message a.restore-item {
        text-align: left;
        width: auto;
    }

    .login-box {
        padding: 40px 30px;
    }

    .result-pagination ul.page-numbers {
        margin-top: 40px;
    }

    .all-htmlthemes .result-pagination,
    .all-graphicstemplates .result-pagination {
        margin-top: 10px;
    }

    .theme-details {
        padding: 17px 30px;
    }

    .theme-box:hover .theme-details {
        padding: 23px 30px;
    }

    .video-section {
        padding-top: 49px;
    }

    .plugin-features {
        padding: 52px 0px 30px;
    }

    .main-banner .btn-wp .sec-btn {
        display: block;
        width: 180px;
        padding: 10px 5px;
        margin: 0 auto !important;
        margin-bottom: 20px !important;
    }

    .main-banner .btn-wp .sec-btn:only-child,
    .main-banner .btn-wp .sec-btn:last-child {
        margin-bottom: 0 !important;
    }

    .btn-wp form.cart~.sec-btn {
        margin-left: auto !important;
    }

    .btn-wp .sec-btn.live-demo {
        margin-left: 0;
    }

    .about-theme .btn-wp .sec-btn {
        display: block;
        width: 180px;
        padding: 10px 5px;
        margin-right: 0 !important;
        margin-bottom: 20px !important;
    }

    .about-theme .btn-wp .sec-btn:last-child {
        margin-bottom: 0 !important;
        margin-left: 0 !important;
    }

    .theme-overview.graphic-template-overview {
        margin-bottom: 30px;
    }

    .contact-details {
        padding: 60px 0;
    }

    .preview-devices {
        display: none;
    }

    .btn-wp {
        display: block;
    }

    .main-banner .btn-wp form.cart .sec-btn {
        margin-left: auto !important;
        margin-right: auto !important;
        margin-bottom: 20px !important;
    }

    .about-theme .btn-wp form.cart .sec-btn {
        margin-bottom: 20px !important;
    }

    .main-plugins-videos {
        padding: 52px 0 60px 0;
    }

    .plugins-videos-slider .plugins-img {
        height: 320px;
    }

    .video-section .title {
        margin-bottom: 52px;
    }

    .features-box-text h2 {
        font-size: 25px;
        line-height: 35px;
    }
}

@media screen and (max-width: 575px) {
    .container {
        padding: 0 30px;
    }

    .h1-title {
        font-size: 40px;
        line-height: 50px;
    }

    .search-input,
    .search-section .form-input,
    .search-select.form-element .form-input,
    .form-element {
        width: 100%;
        display: block;
    }

    .plugin-details,
    .donate {
        padding: 30px 20px 40px;
        margin-left: 0;
    }

    .plugin-details .sec-btn {
        width: 100%;
    }

    .single-theme .banner-img {
        margin-bottom: 0px;
    }

    .sec-btn.min-btn {
        margin-left: 0px;
    }

    .theme-btn a.sec-btn {
        display: block;
        margin: 20px auto 0 auto !important;
    }

    .all-creativelogos .theme-btn a {
        margin: 0 auto !important;
    }

    .footer-bottom-link li {
        padding: 0 5px;
    }

    .plugin-bg {
        padding: 20px;
    }

    .plugin-bg:before {
        height: calc(100% - 20px);
        width: calc(100% - 20px);
        border: 1px solid var(--purple);
    }

    .plugins-img {
        height: 280px;
    }

    .woocommerce .woocommerce-ordering,
    .woocommerce-page .woocommerce-ordering {
        float: none;
        display: block;
        margin-top: 15px;
    }

    .woocommerce .woocommerce-ordering select.form-input {
        width: 100%;
    }

    .woocommerce div.product .woocommerce-tabs ul.tabs li a {
        padding: 10px;
        font-size: 14px;
    }

    .woocommerce div.product form.cart .variations select {
        width: 200px;
        margin-right: 9px;
    }

    .woocommerce div.product form.cart .variations td.value:before {
        left: 165px;
    }

    .testimonial-box {
        padding: 86px 20px 74px 30px;
    }

    .plugin-details span {
        margin-right: 9px !important;
    }

    .plugin-details span {
        font-size: 14px;
        width: 138px;
    }

    .plugin-details ul li .star-rating-wp .star-rating,
    .plugin-details ul li .star-rating .star-rating__fill {
        font-size: 14px;
    }

    .plugin-details ul li span:first-of-type {
        margin-right: -5px !important;
    }

    .modal-body.overflow-text {
        padding: 60px 15px 30px;
    }

    .plugins-videos-slider .plugins-img {
        height: 250px;
    }

    .plugin-video-thumbnail-box {
        height: 60px;
    }

    .play-btn {
        width: 60px;
        height: 60px;
    }

    .play-btn i.fas.fa-play {
        font-size: 16px;
    }
}

@media screen and (max-width: 425px) {

    .container,
    .site-header .container,
    .preview-header .container {
        padding: 0px 15px;
    }

    .header-right {
        right: 53px;
    }

    .menu-toggle,
    .sticky_head .menu-toggle {
        width: 40px;
        height: 40px;
    }

    .header-right .sec-btn i {
        margin-left: 0;
    }

    .login.sec-btn {
        right: 60px;
    }

    .sticky_head .login.sec-btn {
        right: 55px;
    }

    .main-banner,
    .main-banner.wordpress-plugin,
    .main-banner.wordpress-themes {
        padding: 140px 0;
    }

    .h1-title {
        font-size: 10vw;
        line-height: 12vw;
    }

    .h2-title {
        font-size: 28px;
        line-height: 38px;
    }

    .testimonial-box {
        padding: 86px 20px 74px;
        margin: 30px 10px 0px;
    }

    .testimonial-box .overflow-text {
        max-height: 150px;
    }

    .footer-bottom-link li {
        padding: 0 5px;
    }

    .shortcode-details:before {
        height: 90%;
        width: 90%;
    }

    .about-theme-content a.sec-btn.min-btn {
        margin: 15px 0 0;
    }

    .about-theme-content .title,
    .about-theme-content .overflow-text {
        text-align: left;
    }

    .first-img {
        height: 160px;
    }

    .theme-title .h2-title {
        font-size: 25px;
    }

    .contact-us-form {
        padding: 30px 15px;
    }

    .screenshot-slider {
        height: 250px;
        border: 10px solid var(--purple);
        border-radius: 15px;
    }

    .screenshot-img {
        height: 230px;
    }

    .screenshot-section {
        margin-bottom: 185px;
    }

    .screenshot-section .slick-dotted.slick-slider,
    .screenshot-slider {
        margin-bottom: -125px;
    }

    .screenshot-slider .slick-dots {
        bottom: -56px;
    }

    .screenshot-slider .slick-arrow {
        left: -25px;
    }

    .screenshot-slider .slick-next.slick-arrow {
        left: auto;
        right: -25px;
    }

    .woocommerce ul.products li.product a img {
        height: 250px;
    }

    .woocommerce div.product div.images .woocommerce-product-gallery__wrapper,
    .woocommerce div.product div.images .woocommerce-product-gallery__wrapper .woocommerce-product-gallery__image {
        height: 250px;
    }

    .woocommerce div.product div.images .flex-control-thumbs {
        margin-left: -5px;
        margin-right: -5px;
    }

    .woocommerce div.product div.images .flex-control-thumbs li {
        padding: 0 5px;
    }

    .woocommerce div.product div.images .flex-control-thumbs li img {
        height: 60px;
    }

    .woocommerce div.product .woocommerce-tabs .panel {
        padding: 30px 15px;
    }

    .woocommerce div.product .woocommerce-tabs .panel h2 {
        font-size: 25px;
    }

    .woocommerce div.product .woocommerce-tabs ul.tabs {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        text-align: center;
    }

    .woocommerce div.product .woocommerce-tabs ul.tabs li a {
        width: 100%;
        height: 40px;
        display: flex;
        align-items: center;
        padding: 0 5px;
    }

    .woocommerce table.shop_table tr.cart_item td,
    .woocommerce table.shop_table td.actions {
        padding: 20px 15px;
    }

    .woocommerce .cart-collaterals .cart_totals,
    .woocommerce-page .cart-collaterals .cart_totals {
        padding: 30px 15px;
    }

    #add_payment_method #payment ul.payment_methods,
    .woocommerce-cart #payment ul.payment_methods,
    .woocommerce-checkout #payment ul.payment_methods,
    #add_payment_method #payment div.form-row,
    .woocommerce-cart #payment div.form-row,
    .woocommerce-checkout #payment div.form-row {
        padding: 20px 15px;
    }

    .login-box {
        padding: 40px 15px;
    }

    .woocommerce form.login,
    .woocommerce form.lost_reset_password,
    .woocommerce form.checkout_coupon,
    .woocommerce form.login,
    .woocommerce form.register {
        padding: 30px 15px;
    }

    .woocommerce table.my_account_orders .button {
        padding: 8px 12px !important;
    }

    .theme-img {
        height: 350px;
    }

    .testimonial-box:before,
    .testimonial-box:after {
        width: 40px;
        height: 28px;
    }

    .testimonial-box:before {
        left: 20px;
    }

    .testimonial-box:after {
        right: 20px;
    }

    .product-updates {
        padding: 30px 15px;
    }

    .search-form .search-field {
        padding: 15px 50px 12px 20px;
    }

    .footer-logo a {
        width: 100px;
        height: 100px;
    }

    .theme-details {
        padding: 17px 15px;
    }

    .theme-box:hover .theme-details {
        padding: 23px 15px;
    }

    .plugins-img {
        height: 250px;
    }

    .single-theme .banner-img {
        padding: 10px;
    }

    .single-theme .banner-img:before {
        border: 1px solid var(--purple);
        height: calc(100% - 20px);
        width: calc(100% - 20px);
    }

    .sticky_head .menu-toggle span:last-child,
    .sticky_head .menu-toggle span:first-child,
    .toggled .menu-toggle span:first-child,
    .toggled .menu-toggle span:last-child,
    .menu-toggle span:last-child,
    .menu-toggle span:first-child {
        width: 25px;
    }

    .search-form-box {
        padding: 30px 15px 40px 15px;
    }

    .plugin-banner {
        margin-top: -60px;
    }

    .plugin-bg {
        padding: 10px;
    }

    .plugin-bg:before {
        height: calc(100% - 10px);
        width: calc(100% - 10px);
    }

    .plugins-videos-slider .plugins-img {
        height: 200px;
    }

    .row.video-thumbnail-slider {
        margin-left: -7.5px;
        margin-right: -7.5px;
    }

    .row.video-thumbnail-slider .col-lg-2 {
        padding: 0 7.5px;
    }

    .plugin-video-thumbnail-slider {
        margin-top: 15px;
    }

    .slick-arrow,
    .main-plugins-videos .video-section .slick-arrow {
        width: 40px;
        height: 40px;
        left: -15px;
    }

    .slick-arrow:before {
        width: 20px;
        height: 15px;
    }

    .slick-next.slick-arrow {
        left: auto;
        right: -15px;
    }

    .features-box-row {
        padding: 30px 15px;
    }

    .features-box-text h2 {
        font-size: 22px;
        line-height: 30px;
    }

    .features-box-text {
        padding: 20px 0 0 0;
    }
}

@media screen and (max-width: 350px) {
    .header-right {
        right: 50px;
        transform: scale(1.1);
    }

    .menu-toggle span,
    .sticky_head .menu-toggle span {
        width: 35px;
    }

    .site-header.sticky_head .header-right {
        right: 45px;
    }

    .shortcode-details {
        padding: 22px;
    }

    .plugin-details,
    .donate {
        padding: 30px 15px 40px;
    }

    .plugin-box {
        padding: 35px 15px;
    }

    .screenshot-section .slick-dotted.slick-slider,
    .screenshot-slider {
        margin-bottom: -100px;
    }

    .screenshot-slider {
        height: 200px;
    }

    .screenshot-img {
        height: 180px;
    }

    .screenshot-section {
        margin-bottom: 160px;
    }

    .theme-title .h2-title {
        font-size: 22px;
    }

    .site-branding,
    .sticky_head .site-branding {
        width: 160px;
    }
}

/*========== Responsive End ==========*/

/* animation */

/* Right */

@-webkit-keyframes bounceInRight {

    0%,
    60%,
    75%,
    90%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }

    0% {
        opacity: 0;
        -webkit-transform: translate3d(3000px, 0, 0) scaleX(3);
        transform: translate3d(3000px, 0, 0) scaleX(3);
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(-25px, 0, 0) scaleX(1);
        transform: translate3d(-25px, 0, 0) scaleX(1);
    }

    75% {
        -webkit-transform: translate3d(10px, 0, 0) scaleX(0.98);
        transform: translate3d(10px, 0, 0) scaleX(0.98);
    }

    90% {
        -webkit-transform: translate3d(-5px, 0, 0) scaleX(0.995);
        transform: translate3d(-5px, 0, 0) scaleX(0.995);
    }

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
}

@keyframes bounceInRight {

    0%,
    60%,
    75%,
    90%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }

    0% {
        opacity: 0;
        -webkit-transform: translate3d(3000px, 0, 0) scaleX(3);
        transform: translate3d(3000px, 0, 0) scaleX(3);
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(-25px, 0, 0) scaleX(1);
        transform: translate3d(-25px, 0, 0) scaleX(1);
    }

    75% {
        -webkit-transform: translate3d(10px, 0, 0) scaleX(0.98);
        transform: translate3d(10px, 0, 0) scaleX(0.98);
    }

    90% {
        -webkit-transform: translate3d(-5px, 0, 0) scaleX(0.995);
        transform: translate3d(-5px, 0, 0) scaleX(0.995);
    }

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
}

/* End Right */

/* Left */

@-webkit-keyframes bounceInLeft {

    0%,
    60%,
    75%,
    90%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }

    0% {
        opacity: 0;
        -webkit-transform: translate3d(-3000px, 0, 0) scaleX(3);
        transform: translate3d(-3000px, 0, 0) scaleX(3);
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(25px, 0, 0) scaleX(1);
        transform: translate3d(25px, 0, 0) scaleX(1);
    }

    75% {
        -webkit-transform: translate3d(-10px, 0, 0) scaleX(0.98);
        transform: translate3d(-10px, 0, 0) scaleX(0.98);
    }

    90% {
        -webkit-transform: translate3d(5px, 0, 0) scaleX(0.995);
        transform: translate3d(5px, 0, 0) scaleX(0.995);
    }

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
}

@keyframes bounceInLeft {

    0%,
    60%,
    75%,
    90%,
    to {
        -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
        animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    }

    0% {
        opacity: 0;
        -webkit-transform: translate3d(-3000px, 0, 0) scaleX(3);
        transform: translate3d(-3000px, 0, 0) scaleX(3);
    }

    60% {
        opacity: 1;
        -webkit-transform: translate3d(25px, 0, 0) scaleX(1);
        transform: translate3d(25px, 0, 0) scaleX(1);
    }

    75% {
        -webkit-transform: translate3d(-10px, 0, 0) scaleX(0.98);
        transform: translate3d(-10px, 0, 0) scaleX(0.98);
    }

    90% {
        -webkit-transform: translate3d(5px, 0, 0) scaleX(0.995);
        transform: translate3d(5px, 0, 0) scaleX(0.995);
    }

    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
}

.animate__bounceInLeft {
    -webkit-animation-name: bounceInLeft;
    animation-name: bounceInLeft;
}

/* End Left */

/* ZoomIn */

@-webkit-keyframes zoomIn {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }

    50% {
        opacity: 1;
    }
}

@keyframes zoomIn {
    0% {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }

    50% {
        opacity: 1;
    }
}

.animate__zoomIn {
    -webkit-animation-name: zoomIn;
    animation-name: zoomIn;
}


/* Contact Form */
.write-us-form {
    padding: 30px;
    background: #eee;
    border-radius: 20px;
    margin-block: 60px;
}

.write-us-form input.form-input {
    background: #ffffff;
}

@media screen and (max-width: 400px) {
    .write-us-form {
        padding: 30px 15px;
    }
}

.write-us-form span.wpcf7-not-valid-tip {
    color: #dc3232;
}