@charset "UTF-8";
/*
Theme Name: Article Blog Writer
Author: TheMagnifico52
Theme URI: https://www.themagnifico.net/products/article-blog-writer
Author URI: https://www.themagnifico.net/
Description: Article Blog Writer is a multipurpose and minimal theme designed for writers, bloggers, Blog Writer, Blog Content, Blog Articles, Blog Posts, Blog Writing, Blog Copywriting, Blog Storytelling, Blog Journalism, Blog Publishing, Blog Creation, Blog Editing and agencies who value elegance and sophistication in their online presence. With its clean and retina-ready design, it ensures a visually stunning experience across all devices. Fully responsive and mobile-friendly, this theme adapts seamlessly to different screen sizes, providing a user-friendly interface for readers and developers alike. Built with optimized code and secure, clean code, Article Blog Writer guarantees faster page load times and smooth performance. Its bootstrap framework, shortcodes, and interactive elements allow you to create modern, animated, and engaging layouts effortlessly. Whether you’re a personal blogger or running an agency, the theme comes with advanced personalization options, giving you full control over customization. Showcase your creativity with customizable banners, call-to-action (CTA) buttons, and an elegant testimonial section that builds trust with your audience. A dedicated team section allows agencies and professional writers to highlight their members, while integrated social media options boost your online presence and connectivity. The theme is agency-friendly, offering extensive customization options that suit both individual creators and businesses. Translation-ready and globally adaptable, it supports multilingual audiences, making your blog accessible worldwide. With a focus on sophistication and luxury, Article Blog Writer combines modern aesthetics with practical functionality. Its stunning design, clean structure, and interactive features create a professional platform for sharing stories, articles, or business updates. From elegant typography to smooth animations, every detail reflects a sense of refined style. Perfect for bloggers, writers, and content creators, Article Blog Writer provides the ultimate balance of beauty, performance, and flexibility.
Version: 0.0.1
Requires at least: 5.0
Tested up to: 6.8
Requires PHP: 7.2
License: GNU General Public License v3.0
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Text Domain: article-blog-writer
Tags: wide-blocks, block-styles, custom-logo, one-column, two-columns, grid-layout, sticky-post, custom-background, custom-colors, custom-header, custom-menu, featured-image-header, featured-images, flexible-header, footer-widgets, post-formats, threaded-comments, theme-options, left-sidebar, right-sidebar, full-width-template, editor-style, education, portfolio, blog
Article Blog Writer WordPress Theme has been created by TheMagnifico(themagnifico.net), 2025.
Article Blog Writer WordPress Theme is released under the terms of GNU GPL
*/

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

body {
  margin: 0;
  font-family: "Inter", sans-serif;
  color: #797979;
  background: #fff;
  overflow-x: hidden;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: #000;
  font-weight: bold;
}

pre {
  font-size: 1em;
}

a {
  color: #BF00FF;
  background-color: transparent;
  text-decoration: none;
}

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
}

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

b,
strong {
  font-weight: bolder;
}

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

small {
  font-size: 80%;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

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

button,
input,
optgroup,
select,
textarea {
  font-size: 100%;
  line-height: 1.15;
  margin: 0;
}

img {
  border-style: none;
}

/**
 * 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;
}

/**
 * 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;
}

input[type="text"]:focus,
input[type="email"]:focus,
textarea:focus,
.header_in button:focus {
  outline: -webkit-focus-ring-color auto 1px;
}

/**
 * Restore the focus styles unset by the previous rule.
 */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  vertical-align: baseline;
}

/**
 * 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 */
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */
textarea {
  overflow: auto;
}

/**
 * Alignment CSS
 */
/*.alignwide {
  margin-left  : -80px;
  margin-right : -80px;
}
.alignfull {
  margin-left  : calc( -100vw / 2 + 100% / 2 );
  margin-right : calc( -100vw / 2 + 100% / 2 );
  max-width    : 100vw;
}
.alignfull img {
  width: 100vw;
}*/

/**
 * 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;
}

/**
 * Add the correct display in IE 10.
 */
[hidden] {
  display: none;
}


/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
.custom-header *,
.featured-header-image * {
  color: white;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}

/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/
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. */
}

.entry-content a,
.textwidget a,
.comment-content a,
.woocommerce-product-details__short-description a,
#page-content p a, #colophon p a, .sidebar p a {
  text-decoration: underline;
}
#colophon p a {
  color: #000;
}

#page-content p a:hover,
a:hover {
  color: #ED8914;
}

#masthead {
  margin-bottom: 4em;
}

.page-template-home-template #masthead {
  margin-bottom: 0;
}

.custom-logo-link img {
  display: inline-block;
  max-height: 80px;
  width: auto;
}

/*--------------------------------------------------------------
# Scroll Back
--------------------------------------------------------------*/
#button {
  display: inline-block;
  background: linear-gradient(238.66deg, #0283E9 -18.13%, #FC01CA 120.27%);
  width: 55px;
  height: 55px;
  text-align: center;
  position: fixed;
  bottom: 60px;
  right: 30px;
  transition: background-color .3s, opacity .5s, visibility .5s;
  opacity: 0;
  visibility: hidden;
  z-index: 1;
  padding: 18px 0;
  font-weight: bold;
}

a#button {
  color: #ffffff !important;
}

#button:hover,
#button:active {
  cursor: pointer;
  background-color: #222222;
}

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

/*--------------------------------------------------------------
# Form
--------------------------------------------------------------*/

.post-password-form input[type="password"] {
  margin-top: 0.4375em;
}


/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
.top-header {
  background: #050505;
  color: #fff;
}
.subscribe-text P {
  color: #fff;
  font-size: 15px;
}
.subscribe-text a.subs-btn {
  text-decoration: none;
  color: #BF00FF;
  padding: 6px 12px;
  border-radius: 5px;
  background: #fff;
  line-height: 1.2;
  font-size: 14px;
}
.subscribe-text a {
  display: inline-block;
  font-weight: 700;
  color: #fff;
  text-decoration: underline;
}
.subscribe-text a:hover {
  color: #BF00FF;
}
.subscribe-text p span {
  color: #BF00FF;
  font-weight: 700;
  display: inline-block;
}
.social-icons a i {
  display: inline-block;
  color: #000;
  background: #ffffff;
  font-size: 12px;
  padding: 8px;
  border-radius: 50%;
  margin-left: 10px;
  line-height: 1;
  text-align: center;
  width: 28px;
  height: 28px;
}
.social-icons a:hover i {
  color: #fff;
  background: linear-gradient(90deg, #4F5BE0 0%, #B526D3 100%);
}
.toggle-btn {
  padding: 5px 7px;
  background-color: #fff;
  border: none;
  border-radius: 20px;
  cursor: pointer;
  color: #000;
  font-size: 16px;
  transition: all 0.3s ease;
  width: 55px;
  height: max-content;
  margin: 4px 0;
  align-self: anchor-center;
  position: relative;
  text-align: right;
}
.toggle-btn:before {
  content: '';
  width: 15px;
  height: 15px;
  border-radius: 50%;
  background: #000;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 7px;
}
.toggle-btn.active:before {
  left: auto;
  right: 7px;
  background: #fff;
}
.toggle-btn i {
  color: #000;
  font-size: 15px;
}
.toggle-btn.active i {
  color: #fff;
}
.toggle-btn.active i:before {
  content: '\f185';
}
.toggle-btn.active {
  background-color: #000;
  text-align: left;
}
.header-box {
  display: flex;
  gap: 20px;
  justify-content: flex-end;
}
.navigation_header {
  align-self: center;
}
.main-header {
  background: linear-gradient(90deg, #4F5BE0 0%, #B526D3 100%);
  padding: 15px 0;
}

/*--------------------------------------------------------------
## Logo
--------------------------------------------------------------*/
.navbar-brand a {
  color: #fff;
  font-weight: 600;
  font-size: 25px;
  width: 100%;
}

.navbar-brand p {
  color: #fff;
  font-size: 15px;
  margin-bottom: 0;
}

.navbar-dark .navbar-brand {
  color: #fff;
  text-align: left;
  display: block;
}

.navbar-brand h1.site-title,
p.site-title {
  margin-bottom: 0;
  font-size: 25px;
  text-align: left;
}


/*--------------------------------------------------------------
## Top Banner
--------------------------------------------------------------*/
#top-banner, .banner-img-content {
  position: relative;
}
.banner-img-content {
  background: #000;
  border-radius: 0 0 50px 50px;
  position: relative;
}
#top-banner .banner-img {
  width: 100%;
  border-radius: 0 0 50px 50px;
  height: 100%;
  object-fit: cover;
  opacity: 0.7;
  position: absolute;
  top: 0;
  left: 0;
}
#top-banner .banner-content {
  margin-left: 30%;
  margin-right: 30%;
  padding: 95px 0;
  position: relative;
  z-index: 9;
}
#top-banner .banner-content h2 {
  color: #ffffff;
  font-weight: 400;
  font-size: 55px;
  text-align: center;
  font-family: "Instrument serif", serif;
}
#top-banner .banner-content p{
  font-size: 15px;
  color: #ffffff;
  text-align: center;
}
.search-form-main form {
  background: #ffffff;
  border-radius: 4px;
  padding: 3px;
  display: flex;
  justify-content: space-between;
}
.search-form-main form label {
  width: 87%;
  position: relative;
  padding-left: 25px;
}
.search-form-main label:before {
  content: '\f002';
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 10px;
  color: #959EAD;
}
.search-form-main form label input {
  border: 0;
}
.search-form-main form label input::placeholder {
  color: #959EAD;
}
.search-form-main form input.search-submit.btn.btn-primary {
  background: linear-gradient(180deg, #505AE0 0%, #730099 100%);
  font-size: 13px;
  font-weight: 700;
  border: 0;
  border-radius: 4px;
  padding: 8px 12px;
}
.popular-tag {
  color: #ffffff;
  font-size: 14px;
  font-weight: 600;
}
.popular-tag span, .popular-tag ul {
  display: inline-block;
}
.popular-tag ul {
  padding-left: 20px;
}
.popular-tag ul li{
  list-style: none;
  display: inline-block;
  margin: 5px;
}
.popular-tag ul li a, .single-tags a {
  display: inline-block;
  color: #ffffff;
  font-weight: 400;
  padding: 6px 10px;
  border: 1px solid #ffffff;
  border-radius: 5px;
  background: #00000033;
  backdrop-filter: blur(20px);
  font-size: 13px;
  line-height: 1;
}
.single-tags a {
  color: #000;
  background: transparent;
  border-color: #000;
  text-decoration: none;
}
.popular-tag ul li a:hover {
  background: #ffffff;
  color: #000;
}
#top-banner .banner-post {
  position: relative;
  margin-top: -5em;
  z-index: 9;
}
#top-banner .banner-post .post-box {
  margin: 0 15px;
}
#top-banner .post-img img {
  border-radius: 6px;
  height: 250px;
  object-fit: cover;
  position: relative;
  z-index: 9;
}
#top-banner .banner-post .post-img {
  position: relative;
  margin-left: -15px;
  margin-top: 40px;
  z-index: 9;
}
#top-banner .banner-post .post-img:after {
  content: '';
  width: 30%;
  height: 30%;
  background: linear-gradient(180deg, #505AE0 0%, #B227D3 100%);
  position: absolute;
  top: -15px;
  right: -15px;
  border-radius: 6px;
}
#top-banner .banner-post .post-content {
  background: #fff;
  border-radius: 6px;
  padding: 25px 100px 25px 25px;
  position: relative;
  margin-right: -15px;
  margin-left: 10px;
}
.banner-post .post-content:before {
  content: '';
  width: 102%;
  height: 95%;
  background: linear-gradient(180deg, #505AE0 0%, #B227D3 100%);
  position: absolute;
  left: -20px;
  bottom: -20px;
  border-radius: 6px;
  z-index: -1;
}
.banner-post .post-cat a {
  display: inline-block;
  background: linear-gradient(180deg, #505AE0 0%, #B227D3 100%);
  color: #ffffff;
  font-size: 14px;
  font-weight: 500;
  padding: 8px 12px;
  border-radius: 6px;
  line-height: 1;
  margin: 0 5px 5px 0;
}
.banner-post h4 a {
  color: #181A2A;
}
.banner-post h4 {
  font-size: 24px;
  font-weight: 800;
}
.banner-post .meta-info-box span, .banner-post .meta-info-box a {
  color: #97989F;
  text-transform: capitalize;
  font-size: 15px;
}
.banner-post .meta-info-box a {
  font-weight: 800;
}
.banner-post .meta-info-box img {
  width: 35px;
  border-radius: 50%;
  display: inline-block;
  margin-right: 8px;
}
.banner-post .owl-nav button {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  border: 0;
  background: #000;
  color: #ffffff;
  padding: 6px 12px;
  border-radius: 5px;
  font-size: 25px;
}
.banner-post .owl-nav button.owl-next {
  background: linear-gradient(180deg, #505AE0 0%, #B227D3 100%);
  left: auto;
  right: 0;
}

/*--------------------------------------------------------------
## Choose US Section
--------------------------------------------------------------*/
#chooseus-section h3 {
  font-size: 25px;
  color: #2b2b2b;
  font-weight: 700;
  text-align: center;
}
.chooseus-box h4 {
  font-size: 20px;
  font-weight: 600;
}
.chooseus-box h4 a {
  color: #2b2b2b;
}
.chooseus-box p, body.dark-theme .chooseus-box p{
  color: #828089;
  font-size: 15px;
  font-weight: 300;
  line-height: 1.8;
}
.chooseus-box {
  padding: 20px;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0px 1px 10px 0px #0000001A;
  height: 320px;
  align-content: center;
}
.chooseus-box .chooseus-icon {
  background: linear-gradient(238.66deg, #0283E9 -18.13%, #FC01CA 120.27%);
  color: #ffffff;
  padding: 25px 20px;
  border-radius: 50%;
  width: 80px;
  height: 80px;
  text-align: center;
  margin-bottom: 20px;
}
.chooseus-box .chooseus-icon i {
  color: #fff;
  font-size: 30px;
}
.chooseus-box:hover {
  background: linear-gradient(238.66deg, #0283E9 -18.13%, #FC01CA 120.27%);
}
.chooseus-box:hover p, .chooseus-box:hover h4 a, body.dark-theme .chooseus-box:hover p {
  color: #fff;
}
.chooseus-box:hover .chooseus-icon {
  background: #fff;
}
.chooseus-box:hover .chooseus-icon i {
  background: linear-gradient(238.66deg, #0283E9 -18.13%, #FC01CA 120.27%);
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/*--------------------------------------------------------------
## Body Dark
--------------------------------------------------------------*/
body.dark-theme {
  background: #000;
  color: #fff;
}
body.dark-theme h1, body.dark-theme h2, body.dark-theme h3, body.dark-theme h4, body.dark-theme h5, body.dark-theme h6, body.dark-theme p, body.dark-theme #chooseus-section h3, body.dark-theme .single-tags a, body.dark-theme .sidebar li, body.dark-theme .sidebar li a, body.dark-theme .sidebar select, body.dark-theme .sidebar .tagcloud a, body.dark-theme p.wp-block-tag-cloud a, body.dark-theme .meta-info-box span, body.dark-theme .meta-info-box a {
  color: #fff;
}
.banner-post .owl-nav button.owl-prev {
  background: #BF00FF;
}
body.dark-theme .article-box p, body.dark-theme .sticky .entry-title::before, body.dark-theme select option, .comment-content.card-block p {
  color: #797979;
}
body.dark-theme .sidebar section, body.dark-theme .sidebar select {
  border-color: #fff;
}

/*--------------------------------------------------------------
## Sticky
--------------------------------------------------------------*/

.stick_header {
  position: fixed;
  width: 100%;
  z-index: 999;
  top: 0;
  background: #ebebeb;
}

.admin-bar .navigation_header.stick_header {
  margin-top: 32px;
}

/*--------------------------------------------------------------
## Preloader
--------------------------------------------------------------*/
.dot {
  height: 20px;
  width: 20px;
  border-radius: 50%;
  display: inline-block;
  margin: 6px;
  animation: loading 2s cubic-bezier(0.45, 0, 0.55, 1) infinite;
}

.loading {
  background-color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  width: 100%;
  position: fixed;
  z-index: 99999;
}

@keyframes loading {

  0%,
  100% {
    transform: translatey(-2.5rem);
    background: linear-gradient(90deg, #4F5BE0 0%, #B526D3 100%);
  }

  50% {
    transform: translatey(2.5rem);
    background: linear-gradient(90deg, #4F5BE0 0%, #B526D3 100%);
  }
}

/*--------------------------------------------------------------
## Articale
--------------------------------------------------------------*/
#latest_post h2 {
  font-size: 30px;
}

.postcat-name {
  font-size: 14px;
  color: #BF00FF !important;
  font-weight: bold;
}

.article-box {
  background: #fff;
  padding: 15px;
  border-radius: 10px;
  margin-bottom: 30px;
  border: 1px solid #eee;
}

.article-box p,
.sidebar ul li a {
  overflow-wrap: anywhere;
}

.article-box img {
  border-radius: 10px;
  width: 100%;
}

.article-box h3.entry-title {
  font-size: 20px;
  margin-bottom: 0;
}

.sidebar .search-from,
.sidebar form.woocommerce-product-search {
  padding: 10px;
}

.sidebar .widget {
  padding: 10px;
}

.sidebar input[type="submit"],
.sidebar button[type="submit"] {
  width: 100%;
  background: linear-gradient(90deg, #4F5BE0 0%, #B526D3 100%);
  border: none;
  color: #ffffff;
  font-weight: bold;
  font-size: 14px;
}

h2.entry-title,
h1.entry-title,
h2.page-title {
  font-size: 40px;
}

h2.entry-title {
  word-wrap: break-word;
}

.article-box a {
  word-wrap: break-word;
  color: #BF00FF;
}

.author-date a {
  font-weight: 600;
  text-transform: capitalize;
}

a.btn-text {
  background: linear-gradient(90deg, #4F5BE0 0%, #B526D3 100%);
  padding: 10px 20px;
  font-size: 13px;
  line-height: 21px;
  text-transform: uppercase;
  color: #ffffff;
  font-weight: 500;
  text-align: center;
  border-radius: 30px;
}
a.btn-text:hover, #top-banner .banner-form .wpcf7-form input[type="submit"]:hover {
  background: #000;
}

.meta-info-box span,
.meta-info-box a {
  color: #222222;
  text-transform: uppercase;
  font-size: 13px;
}

.entry-summary p {
  line-height: 1.7;
  font-size: 15px;
}

/*--------------------------------------------------------------
## Woocommerce Product CSS
--------------------------------------------------------------*/

.woocommerce ul.products li span.price {
  margin: 0 5px;
}

.woocommerce a.button.product_type_simple.add_to_cart_button {
  margin-right: 10px;
}

.woocommerce ul.products li.product a img {
  margin: 0;
}

p.price,
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price {
  color: #BF00FF;
  font-weight: bold;
  font-size: 14px;
}

span.onsale {
  position: absolute;
  top: 0;
  left: 0;
  background: linear-gradient(90deg, #4F5BE0 0%, #B526D3 100%);
  color: #fff;
  padding: 2px 5px;
  font-weight: bold;
  font-size: 10px;
  text-transform: uppercase;
}

.pro-button a,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt.disabled,
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce a.added_to_cart {
  padding: 9px 14px;
  color: #ffffff;
  font-size: 15px;
  border-radius: 30px !important;
  background: linear-gradient(90deg, #4F5BE0 0%, #B526D3 100%);
}

.pro-button a:hover,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt.disabled,
.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles)) button.button.alt.disabled:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit.alt:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover {
  background: #222222;
  color: #fff;
}

ins {
  text-decoration: none;
}

.woocommerce ul.products li {
  text-align: center;
  box-shadow: 0 0 20px 2px #d7d7d7;
  padding: 15px !important;
}

.woocommerce ul.products li.product .onsale,
.woocommerce span.onsale {
  position: absolute;
  top: 15px;
  color: #ffffff;
  font-weight: bold;
  font-size: 10px;
  text-transform: uppercase;
  left: 15px;
  right: auto;
  background: linear-gradient(90deg, #4F5BE0 0%, #B526D3 100%);
  padding: 2px 5px;
  border-radius: 0px;
  margin: 0px;
  min-height: 20px;
  line-height: 1.5;
}

.woocommerce ul.products li.product .star-rating,
.woocommerce .star-rating {
  margin: 0px auto 10px;
  color: #ffc53f;
}

p#billing_address_2_field {
   position: relative;
}

.woocommerce .woocommerce-ordering select {
  background: linear-gradient(90deg, #4F5BE0 0%, #B526D3 100%);
  color: #ffffff;
  padding: 2px;
  border: 1px solid #e3e3e3;
}

.woocommerce .entry-summary {
  margin: 0;
}

.woocommerce .quantity .qty {
  padding: 8px;
  border: solid 2px #222222;
}

.woocommerce-message,
.woocommerce-info {
  border-top-color: #BF00FF;
}

.woocommerce-message::before,
.woocommerce-info::before {
  color: #BF00FF;
}

input[type="text"],
input[type="email"],
input[type="phno"],
input[type="password"],
textarea {
  border: 1px solid #bcbcbc;
  width: 100%;
  font-size: 16px;
  padding: 10px 10px;
  margin: 0 0 23px 0;
  height: auto;
}

span.woocommerce-input-wrapper,
.checkout label,
.woocommerce-account .woocommerce-MyAccount-navigation,
.woocommerce-account .woocommerce-MyAccount-content,
.woocommerce form .form-row label,
span.password-input,
header.page-header {
  width: 100%;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul {
  padding: 0;
  list-style: none;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li {
  display: initial;
  background: linear-gradient(90deg, #4F5BE0 0%, #B526D3 100%);
  padding: 10px;
  margin-right: 5px;
  font-size: 15px;
  font-weight: 600;
}

.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
  color: #ffffff;
}

h2.woocommerce-loop-product__title {
  font-size: 32px !important;
  padding: 8px 0 !important;
}

.woocommerce #customer_login .col2-set .col-1,
.woocommerce-page .col2-set .col-1,
.woocommerce #customer_login .col2-set .col-2,
.woocommerce-page .col2-set .col-2 {
  display: table-cell;
  max-width: 100%;
  float: none;
}

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

/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/
.main-navigation .menu ul {
  margin-bottom: 0px;
  padding: 0px;
  display: inline-block;
}

.main-navigation .menu li {
  display: inline;
  position: relative;
  list-style: none;
}

#site-navigation .menu ul li a {
  padding: 15px;
  font-size: 14px;
  color: #fff;
  font-weight: 500;
}

#site-navigation .menu ul li a:hover {
  color: #050505;
}

.navigation_header .nav,
.navbar-expand-xl {
  justify-content: flex-start;
}

nav#site-navigation {
  padding: 0;
}
.main-navigation .sub-menu>li>a {
  position: relative;
  z-index: 9;
}
.main-navigation .sub-menu>li>a:before {
  content: '';
  width: 0;
  height: 100%;
  position: absolute;
  left: 50%;
  top: 0%;
  transform: translateX(-50%);
  z-index: -1;
  background: #000;
  transition: 0.5s all ease-in-out;
  border-radius: 10px;
}

.main-navigation ul.sub-menu>li>a:hover:before,
.main-navigation ul.sub-menu>li>a:focus {
  width: 100%;
}
.main-navigation ul.sub-menu>li>a:hover {
  color: #fff;
}
.main-navigation ul.sub-menu li a {
  color: #ffffff !important;
}

/*.main-navigation ul.sub-menu>li>a:hover,
.main-navigation ul.sub-menu>li>a:focus {
  background: #1A1819;
}
*/
.main-navigation .menu {
  display: inline-block;
  margin: 0;
  padding: 0;
}

.main-navigation .menu>li {
  display: inline;
  position: relative;
  padding: 8px 16px;
}

.main-navigation .menu>li>a {
  display: inline-block;
  color: #fff;
  font-size: 14px;
  text-transform: capitalize;
  position: relative;
}
.main-navigation .menu>li>a:hover {
  color: #000;
}

.main-navigation .menu ul.sub-menu li a:after, .main-navigation .menu ul.sub-menu ul.sub-menu li a:after {
  display: none;
}
.main-navigation .menu li.menu-item-has-children a:after, .main-navigation .menu ul.sub-menu li.menu-item-has-children a:after {
  content: '\f078';
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  font-size: 8px;
  display: inline-block;
  margin-left: 3px;
}
.main-navigation .menu ul.sub-menu li.menu-item-has-children a:after {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 10px;
}
.main-navigation .sub-menu {
  background: linear-gradient(90deg, #4F5BE0 0%, #B526D3 100%);
  list-style: none;
  padding-left: 0;
  position: absolute;
  opacity: 0;
  left: -9999px;
  z-index: 99999;
  width: 200px !important;
  border-radius: 5px;
}



.main-navigation .sub-menu li ul.sub-menu {
  left: 200px !important;
  top: 0px;
}

.main-navigation .sub-menu>li {
  display: block;
  float: none;
  position: relative;
}

.main-navigation .sub-menu>li.menu-item-has-children .submenu-expand {
  display: inline-block;
  position: absolute;
  width: calc(24px + 1rem);
  right: 0;
  top: calc(.125 * 1rem);
  bottom: 0;
  color: white;
  line-height: 1;
  padding: calc(.5 * 1rem);
}

.main-navigation .sub-menu>li.menu-item-has-children .submenu-expand {
  margin-right: 0;
}

.main-navigation .sub-menu>li>a,
.main-navigation .sub-menu>li>.menu-item-link-return {
  color: #fff;
  display: block;
  padding: 15px;
  font-weight: 600;
}

.main-navigation .sub-menu>li>.menu-item-link-return {
  width: 100%;
  font-size: 22px;
  font-weight: normal;
  text-align: left;
}

.main-navigation .sub-menu>li>a:empty {
  display: none;
}

.main-navigation .sub-menu>li.mobile-parent-nav-menu-item {
  display: none;
  font-size: 0.88889em;
  font-weight: normal;
}

.main-navigation .menu .menu-item-has-children:not(.off-canvas):hover>.sub-menu,
.main-navigation .menu .menu-item-has-children:not(.off-canvas):focus>.sub-menu,
.main-navigation .menu .menu-item-has-children.is-focused:not(.off-canvas)>.sub-menu,
.main-navigation .menu .menu-item-has-children:not(.off-canvas)[focus-within]>.sub-menum,
.main-navigation .menu .menu-item-has-children:not(.off-canvas):focus-within>.sub-menu {
  display: block;
  left: 0;
  margin-top: 0;
  opacity: 1;
  width: auto;
  min-width: 100%;
}

/*--------------------------------------------------------------
## Next / Previous
--------------------------------------------------------------*/
/* Next/Previous navigation */
.site-main .comment-navigation,
.site-main .posts-navigation,
.site-main .post-navigation {
  margin: 0 0 1.5em;
  overflow: hidden;
  width: 100%;
}

.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%;
}

.comment-content.card-block {
  padding: 20px;
}

.navigation.post-navigation {
  padding-top: 1.875rem;
}

.post-navigation .nav-previous a,
.post-navigation .nav-next a,
.posts-navigation .nav-previous a,
.posts-navigation .nav-next a {
  border: 1px solid #ddd;
  -webkit-border-radius: 0.98rem;
  -moz-border-radius: 0.98rem;
  border-radius: 0.98rem;
  display: inline-block;
  padding: 0.313rem 0.875rem;
  overflow-wrap: anywhere;
  background: white;
  color: #BF00FF;
}

.post-navigation .nav-previous a:hover,
.post-navigation .nav-next a:hover,
.posts-navigation .nav-previous a:hover,
.posts-navigation .nav-next a:hover {
  background: linear-gradient(90deg, #4F5BE0 0%, #B526D3 100%);
  color: #ffffff;
  border: 1px solid #BF00FF;
}

.post-navigation .nav-next a::after,
.posts-navigation .nav-next a::after {
  content: " \2192  ";
}

.post-navigation .nav-previous a::before,
.posts-navigation .nav-previous a::before {
  content: "\2190  ";
}

.navigation.pagination {
  -webkit-box-pack: center !important;
  -ms-flex-pack: center !important;
  justify-content: center !important;
}

.navigation.pagination .nav-links a,
.navigation.pagination .nav-links span {
  border: 1px solid #ddd;
  -webkit-border-radius: 0.98rem;
  -moz-border-radius: 0.98rem;
  border-radius: 0.98rem;
  display: inline-block;
  padding: 0.13rem 0.875rem;
  background: white;
}

.navigation.pagination .nav-links a.current,
.navigation.pagination .nav-links a:hover,
.navigation.pagination .nav-links span.current,
.navigation.pagination .nav-links span:hover {
  background: linear-gradient(90deg, #4F5BE0 0%, #B526D3 100%);
  color: white;
  border: 1px solid #BF00FF;
}

@media screen and (max-width: 560px) {
  .navigation.post-navigation .nav-links {
    display: flex;
    flex-flow: column wrap;
  }

  .navigation.post-navigation .nav-links .nav-previous,
  .navigation.post-navigation .nav-links .nav-next {
    margin-bottom: 14px;
    width: 100%;
    float: none;
    text-align: start;
  }
}

/* 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;
}

.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;
}

/* 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-right: auto;
  margin-left: auto;
}*/
a img .alignright {
  float: right;
  margin: 0.313rem 0 1.25rem 1.25rem;
}

a img .alignnone {
  margin: 0.313rem 1.25rem 1.25rem 0;
}

a img .alignleft {
  float: left;
  margin: 0.313rem 1.25rem 1.25rem 0;
}

a img .aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

.wp-caption .alignnone {
  margin: 0.313rem 1.25rem 1.25rem 0;
}

.wp-caption .alignleft {
  margin: 0.313rem 1.25rem 1.25rem 0;
}

.wp-caption .alignright {
  margin: 0.313rem 0 1.25rem 1.25rem;
}

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

.module-border-wrap {
  -moz-border-image: -moz-linear-gradient(to bottom left, #19b094 0%, #BF00FF 100%);
  -webkit-border-image: -webkit-linear-gradient(to bottom left, #19b094 0%, #BF00FF 100%);
  border-image: linear-gradient(to bottom left, #19b094 0%, #BF00FF 100%) 1;
}

/*--------------------------------------------------------------
## Comments
--------------------------------------------------------------*/
.comment-form-url input {
  width: 100%;
}

.comment-respond input#submit {
  background: linear-gradient(90deg, #4F5BE0 0%, #B526D3 100%);
  border: none;
  color: #ffffff;
  padding: 10px 20px;
  font-weight: 600;
}

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

.bypostauthor {
  display: block;
}

.comments-title {
  font-size: 1.125rem;
}

.comment-body .pull-left {
  padding-right: 0.625rem;
}

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

.comment-list .comment {
  display: block;
}

.comment-list .pingback {
  border-top: 1px solid rgba(0, 0, 0, 0.125);
  padding: 0.563rem 0;
}

.comment-list .pingback a {
  margin-left: 5px;
  margin-right: 5px;
}

/*--------------------------------------------------------------
## Posts and pages
--------------------------------------------------------------*/
.error-404 input.search-field.form-control {
  width: 30%;
}

.btn-primary {
  background-color: #000;
  border-color: #000;
}

.error-404 input.search-submit.btn.btn-primary {
  width: 30%;
  margin-top: 5px;
}

.page-content form.search-from {
  display: flex;
}

.sticky .entry-title a {
  margin-left: 15px;
}

.sticky .entry-title::before {
  content: '\f08d';
  font-family: "Font Awesome\ 5 Free";
  font-size: 20px;
  font-weight: 900;
}

.single .byline,
.group-blog .byline {
  display: inline;
}

.page-content,
.entry-content,
.entry-summary {
  margin: 1.5em 0 0;
}

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

.posted-on,
.byline,
.comments-link {
  color: #9a9a9a;
}

div#respond {
  border: 1px solid #bcbcbc;
  padding: 15px;
}

/*--------------------------------------------------------------
## Footer
--------------------------------------------------------------*/
#colophon {
  background: linear-gradient(90deg, #4F5BE0 0%, #B526D3 100%);
  color: #fff;
}

.widget #wp-calendar caption,
#colophon a,
#colophon h5 {
  color: #fff;
}

#colophon a:hover,
#colophon a:focus {
  color: #050505;
}

#colophon ul {
  list-style: none;
  padding-left: 0;
}

#colophon h5 {
  font-weight: 700;
  font-size: 30px;
  margin-bottom: 28px;
}

#colophon a:hover,
#colophon a:focus {
  color: #050505;
}

.footer-column .widget ul li:hover{
  color: #818181;
}

#colophon .footer-menu ul {
  list-style: none;
  display: flex;
  padding-left: 0;
  margin-bottom: 0;
}
aside#pages ul li:hover{
  color: #000000;
}
#colophon .footer-menu li {
  margin-right: 10px;
}

.site-info {
  padding: 15px 0;
}

.footer-menu-left {
  text-align: right;
}

.footer-column {
  border-bottom: 1px solid #fff;
}

.footer-column .widget {
  padding: 30px 0;
}

.widget select {
  width: 100%;
  padding: 8px 4px;
  border-radius: 10px;
}

a.rsswidget {
  text-decoration-line: underline;
}

#colophon .tagcloud a {
  font-size: 15px !important;
  display: block;
}

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

.widget a:hover,
.widget a:focus {
  color: #BF00FF;
}

.widget ul li.recentcomments {
  display: block;
  padding: 5px 15px;
}

.widget .gallery-item,
.textwidget {
  padding: 10px;
}

.widget #wp-calendar caption {
  caption-side: top !important;
  padding-top: 0;
}

.widget #wp-calendar tbody tr td {
  padding: .5rem;
}

.widget #wp-calendar tfoot {
  text-align: center;
}

.half-rule {
  margin: 2.5rem 0;
  width: 6rem;
}

.sidebar section {
  border: solid 1px #000000;
  margin-bottom: 30px;
}

.sidebar h5, .sidebar .widget h2.wp-block-heading {
  font-size: 20px;
  color: #ffffff;
  background: linear-gradient(90deg, #4F5BE0 0%, #B526D3 100%);
  padding: 15px 10px;
  text-align: center;
  word-wrap: break-word;
  font-weight: 700;
}

.sidebar h5 a, .sidebar h2 a{
  color: #ffffff;
  text-decoration: underline;
}

.sidebar ul {
  list-style: none;
  padding: 0;
}

.sidebar li {
  color: #222222;
  padding: 10px;
  font-size: 15px;
  font-weight: 500;
  margin: 0;
}
.sidebar li article {
  margin-bottom: 0;
}

.sidebar ul li a:before {
  content: '\f30b';
  font-family: "Font Awesome\ 5 Free";
  font-size: 15px;
  margin-right: 10px;
  font-weight: 900;
}

.sidebar ul li a:hover {
  color: #000000;
}

.sidebar ul li a {
  color: #222222;
}

.sidebar .textwidget img,
.sidebar .form-group {
  width: 100%;
  height: auto;
}

.sidebar select {
  padding: 10px;
  border: solid 1px #000000;
  background: transparent;
  font-size: 14px;
  width: 100%;
  color: #222222;
}

.sidebar .tagcloud a,
p.wp-block-tag-cloud a {
  border: 1px solid #e3e3e3;
  color: #222222;
  line-height: 20px;
  padding: 5px 10px;
  font-size: 12px !important;
  display: inline-block;
  margin-bottom: 5px;
}

.sidebar .tagcloud a:hover {
  background: linear-gradient(90deg, #4F5BE0 0%, #B526D3 100%);
  color: #ffffff;
}

p.wp-block-tag-cloud a:hover {
  background: linear-gradient(90deg, #4F5BE0 0%, #B526D3 100%);
  color: #fff;
}

.sidebar .tagcloud {
  margin-top: 15px;
}

.sidebar input[type="search"] {
  padding: 10px;
  width: 100%;
  border: solid 1px #e7ebf1;
  font-size: 15px;
}

.sidebar button[type="submit"] {
  padding: 8px;
  width: 100%;
  color: #fff;
}

.sidebar table#wp-calendar {
  border: solid 1px #e3e3e3;
  text-align: center;
  margin-top: 15px;
  width: 100%;
}

.sidebar th,
#theme-sidebar td {
  border-right: solid 1px #e3e3e3;
  padding: 10px 0;
}

.sidebar tr {
  border-bottom: solid 1px #e3e3e3;
}

/*--------------------------------------------------------------
# Infinite Scroll
--------------------------------------------------------------*/
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
  display: none;
}

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

/*--------------------------------------------------------------
# Audio
--------------------------------------------------------------*/
#footer label,
iframe,
.entry-audio audio,
.sidebar input[type="submit"],
span.woocommerce-input-wrapper,
.checkout label,
.woocommerce-page form .password-input {
  width: 100%;
}

iframe {
  height: auto;
}

/*--------------------------------------------------------------
# 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%;
}

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

.wp-caption {
  background-color: #fff;
  border: 1px solid #dee2e6;
  -webkit-border-radius: 0.25rem;
  -moz-border-radius: 0.25rem;
  border-radius: 0.25rem;
  height: auto;
  max-width: 100%;
  padding: 0.25rem;
}

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

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

.wp-caption-text {
  color: #686868;
  font-size: 13px;
  font-size: 0.8125rem;
  text-align: center;
}

/*--------------------------------------------------------------
## Galleries
--------------------------------------------------------------*/
.gallery {
  margin-bottom: 1.5em;
}

.gallery-item {
  display: inline-block;
  text-align: center;
  vertical-align: top;
  width: 100%;
}

.gallery-columns-2 .gallery-item {
  max-width: 50%;
}

.gallery-columns-3 .gallery-item {
  max-width: 33.33%;
}

.gallery-columns-4 .gallery-item {
  max-width: 25%;
}

.gallery-columns-5 .gallery-item {
  max-width: 20%;
}

.gallery-columns-6 .gallery-item {
  max-width: 16.66%;
}

.gallery-columns-7 .gallery-item {
  max-width: 14.28%;
}

.gallery-columns-8 .gallery-item {
  max-width: 12.5%;
}

.gallery-columns-9 .gallery-item {
  max-width: 11.11%;
}

.gallery-caption {
  display: block;
}

ul.comment-list .comment .media-body {
  overflow: auto;
}

.toggle-nav.mobile-menu,
a.closebtn.mobile-menu {
  display: none;
}
@media screen and (min-width: 1550px) {
  body, .subscribe-text P,.navbar-brand p,.main-navigation .menu>li>a, .toggle-btn i,#top-banner .banner-content p,.search-form-main form label input,.search-form-main form input.search-submit.btn.btn-primary, .popular-tag,.banner-post .post-cat a, .banner-post .meta-info-box span, .banner-post .meta-info-box a,.chooseus-box p, #site-navigation .menu ul li a {
    font-size: 18px;
  }
  .social-icons a i {
    width: 35px;
    height: 35px;
    font-size: 15px;
    padding: 10px 8px;
  }
  .navbar-brand a {
    font-size: 30px;
  }
  .main-navigation .menu li.menu-item-has-children a:after, .main-navigation .menu ul.sub-menu li.menu-item-has-children a:after {
    font-size: 12px;
    margin-left: 5px;
  }
  .toggle-btn {
    width: 70px;
    padding: 8px 10px;
  }
  .toggle-btn:before {
    width: 18px;
    height: 18px;
  }
  #top-banner .banner-content {
    margin-left: 25%;
    margin-right: 25%;
  }
  #top-banner .banner-content h2 {
    font-size: 65px;
  }
  .popular-tag ul li a, .single-tags a {
    font-size: 15px;
  }
  .banner-post h4,.chooseus-box h4 {
    font-size: 28px;
  }
  .banner-post .meta-info-box img {
    width: 45px;
  }
  #top-banner .post-img img {
    height: 300px;
  }
  #top-banner .banner-post .post-content {
    padding: 35px 100px 35px 35px;
  }
  #chooseus-section h3 {
    font-size: 35px;
  }
  .chooseus-box .chooseus-icon {
    width: 100px;
    height: 100px;
    padding: 30px 20px;
  }
  .chooseus-box .chooseus-icon i {
    font-size: 40px;
  }
  .chooseus-box {
    height: 380px;
  }
}
@media screen and (max-width: 1440px) {
  #top-banner .banner-content h2 {
    font-size: 45px;
  }
  #top-banner .banner-content {
    margin-left: 28%;
    margin-right: 28%;
  }
} 


@media screen and (max-width: 1000px) {
  ul#menu-testing-menu li.current-menu-item.current_page_item a {
    border: none;
    color: #ffffff;
  }
  .main-navigation .menu > li > a {
    padding: 10px;
  }

  .admin-bar .sidenav .closebtn {
    top: 30px;
    padding: 2px;
  }

  .main-navigation ul.sub-menu li a {
    color: #ffffff !important;
  }

  .main-navigation ul.sub-menu>li>a:hover,
  .main-navigation ul.sub-menu>li>a:focus {
    background: transparent;
  }

  .main-navigation .menu>li>a:hover {
    color: #BF00FF;
  }

  .toggle-nav.mobile-menu {
    text-align: center;
  }

  .nav-box {
    outline: none;
    padding :5px 0px;
  }

  .main-navigation .sub-menu>li {
    border: none;
  }

  .alignfull {
    max-width: 1000%;
    margin-right: ~"calc(50% - 50vw)";
    margin-left: ~"calc(50% - 50vw)";
    width: auto;
  }

  .alignwide {
    max-width: 1000%;
    margin-right: ~"calc(25% - 25vw)";
    margin-left: ~"calc(25% - 25vw)";
    width: auto;
  }

  .toggle-nav {
    display: none;
    cursor: pointer;
    z-index: 999999;
  }

  .toggle-nav i {
    font-size: 20px;
    color: #fff;
    padding: 8px;
    border-radius: 8px;
    background: #000;
  }

  .toggle-nav button {
    border: none;
    background: transparent;
  }
  .sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 99999999;
    left: 0;
    top: 0;
    overflow-x: hidden;
    transition: 0.5s;
    overflow-y: scroll;
    background: #000;
    visibility: hidden;
  }

  .sidenav.show {
    visibility: visible;
    width: 300px;
  }

  .sidenav .closebtn {
    position: absolute;
    top: 20px;
    margin-left: 10px;
    display: block;
    font-size: 22px;
    background: linear-gradient(90deg, #4F5BE0 0%, #B526D3 100%);
    border-radius: 5px;
    width: 35px;
    height: 35px;
    color: #fff;
    text-align: center;
    right: 14px;
    padding: 6px;
  }

  .sidenav #site-navigation {
    width: 100%;
    padding-top: 50px;
  }

  .toggle-nav,
  .toggle-nav.mobile-menu,
  a.closebtn.mobile-menu,
  .main-navigation ul ul li,
  .nav ul li a {
    display: block;
  }

  .nav ul li ul,
  .nav ul li ul ul {
    display: block !important;
  }

  .nav ul li ul li a:before {
    content: "\00BB \00a0";
  }

  .nav ul li ul li a {
    padding-left: 20px !important;
  }

  .nav ul li ul li ul li a {
    padding-left: 30px !important;
  }

  .nav ul li ul,
  .nav ul li ul ul {
    display: block !important;
    opacity: 1 !important;
  }

  .main-navigation ul ul {
    position: static;
    width: 100%;
  }

  .main-navigation li {
    padding: 0;
  }

  .main-navigation .sub-menu {
    position: static;
    background: transparent !important;
  }

  .main-navigation .menu>li>a,
  .main-navigation .sub-menu>li>a,
  .main-navigation .sub-menu>li>.menu-item-link-return {
    color: #fff;
    display: block;
    border: none;
    text-align: left;
  }

  #site-navigation .menu ul li a {
    color: #fff !important;
  }

  #site-navigation .menu ul li a:hover {
    color: #BF00FF;
  }

  .main-navigation .menu ul {
    text-align: left;
  }

  .navigation_header .nav,
  .navbar-expand-xl {
    justify-content: flex-start;
  }
  .main-navigation .current_page_item>a, .main-navigation .current-menu-item>a, .main-navigation .menu>li>a:hover {
    color: #BF00FF !important;
  }
  #colophon h5 {
    font-size: 20px;
  }
}

@media screen and (max-width: 1024px){
  #top-banner .banner-content {
    margin-left: 22%;
    margin-right: 22%;
  }
}

@media screen and (max-width: 768px) {
  #top-banner .banner-content {
    margin-left: 15%;
    margin-right: 15%;
  }
  #top-banner .banner-post .post-content {
    padding-right: 50px;
  }
  #top-banner .post-img img {
    height: 200px;
  }
  .chooseus-box {
    margin-bottom: 20px;
  }
}
@media screen and (max-width: 720px) {

  .toggle-nav,
  .footer-menu-left,
  #colophon ul,
  .slider-box {
    text-align: center;
  }

  .navbar-brand,
  .admin-bar .navigation_header.stick_header {
    margin: 0 auto;
    width: 100%;
  }
}

@media screen and (max-width: 575px) {
  .contact-box,
  #colophon h5,
  #colophon .tagcloud a {
    text-align: center;
  }
  .site-logo {
    margin-bottom: 20px;
  }
  .subscribe-text a.subs-btn {
    display: inline-block;
    margin: 0 0 10px;
  }
  .heading .main_heading,
  .section-btn, #top-banner .banner-content, .navbar-brand h1.site-title, p.site-title {
    text-align: center !important;
  }
  .subscribe-text {
    margin-bottom: 20px;
  }
  .header-box {
    justify-content: center;
  }
  #top-banner .banner-content h2 {
    font-size: 30px;
  }
  #top-banner .banner-content p {
    display: none;
  }
  #top-banner .banner-content {
    margin-left: 5%;
    margin-right: 5%;
  }
  #top-banner .banner-post {
    margin-top: -2em
  }
  .footer-column {
    padding-top: 30px;
  }
  .footer-column .widget {
    padding: 0 0 30px;
  }
}

@media screen and (max-width: 320px) {
  .woocommerce ul.products li {
    width: 100% !important;
  }
}

@media screen and (max-width:782px) {
  .admin-bar .main-navigation .menu {
    padding-top: 45px;
  }
}

@media screen and (min-width: 783px) and (max-width: 1000px) {
  .admin-bar .main-navigation .menu {
    padding-top: 32px;
  }
}

.button-header a {
  padding: 10px 15px;
}

@media screen and (min-width:1700px) and (max-width:1900px) {
  .container {
    max-width: 1520px;
  }
}

@media screen and (min-width:1920px) {
  .container {
    max-width: 1620px;
  }
  #chooseus-section .right-image {
    right: 80px;
  }
}