/*
Theme Name: Glass Artifact
Description: The Glass Artifact is a multipurpose, modern WordPress theme crafted for elegance and sophistication. It's suitable for Glass Art Studio, Glass Artifact Store, Blown Glass Shop, Stained Glass Artist, Glass Sculptor Portfolio, Glass Gallery, Glassware Boutique, and Decorative Glass Store. With its clean, minimal layout and retina-ready design, it delivers a visually stunning experience across all devices. Whether you're a developer, a creative agency, a personal brand, or a local business, this theme adapts seamlessly to your needs. Its responsive and mobile-friendly structure ensures flawless performance and fast loading on all screen sizes. Built with optimized code and a secure, clean codebase, Glass Artifact ensures both performance and protection. The theme offers smooth navigation with interactive elements and animated sections powered by Bootstrap and custom shortcodes. It’s designed to offer a luxurious look while keeping the user experience intuitive and user-friendly. Glass Artifact features rich personalization options, allowing you to easily customize colors, fonts, layouts, and background elements. Its beautiful banner sections, strategically placed Call to Action (CTA) buttons, and testimonial sections help you engage visitors and convert them into clients. It also supports team showcases, enabling businesses and professionals to highlight key members stylishly. Designed with local business directories in mind, this theme is SEO-ready and translation-ready, helping you reach a wider audience globally. Social media integration makes it easy to connect and grow your presence across platforms. Whether you're launching a portfolio, blog, online service, or business directory, Glass Artifact offers a powerful and stunning visual impact with excellent functionality. With fast page load times, modern design aesthetics, and full customization capabilities, the Glass Artifact theme is a perfect choice for anyone seeking a clean yet luxurious digital presence. It's truly a multipurpose theme built for those who value elegance and performance in a beautifully interactive and responsive package. 
Author: misbahwp
Theme URI: https://www.misbahwp.com/products/glass-artifact
Author URI: https://www.misbahwp.com/
Version: 1.0
Requires PHP: 7.2
Tested up to: 6.8
Requires at least: 5.0
Tags: photography, news, e-commerce, wide-blocks, one-column, two-columns, three-columns, four-columns, right-sidebar, left-sidebar, grid-layout, custom-background, custom-colors, custom-header, custom-logo, custom-menu, featured-images, featured-image-header, footer-widgets, full-width-template, flexible-header, editor-style, post-formats, sticky-post, theme-options, threaded-comments, translation-ready
Text Domain: glass-artifact
License: GNU General Public License v3 or later
License URI: http://www.gnu.org/licenses/gpl-3.0.html

Glass Artifact WordPress Theme has been created by misbahwp(misbahwp.com), 2025.
Glass Artifact WordPress Theme is released under the terms of GNU GPL
*/

:root {
  --first-color: #32BBE5;
  --second-color: #000000;
  --third-color: #FFFFFF;
}

.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;
	-webkit-transition: none;
	-moz-transition: none;
	-o-transition: none;
	transition: none;
}
.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-weight: 600;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}
#content[tabindex="-1"]:focus {
	outline: 0;
}
body {
  font-family: "Poppins", sans-serif;
  color: #a3aab4;
  margin:0;
  background: #fff;
}
h1,h2,h3,h4,h5,h6{
	font-family: "Protest Strike", sans-serif;
	color: var(--second-color);
	font-weight: 400;
}
a {
  color: var(--first-color);
  -webkit-transition: color .1s linear;
  -moz-transition: color .1s linear;
  -o-transition: color .1s linear;
  transition: color .1s linear;
  text-decoration: none;
}

a:hover,
a:focus {
  color:var(--first-color);
  text-decoration: none;
}

.alignwide {
  margin-left  : -80px;
  margin-right : -80px;
}

.alignfull img {
  width: 100vw;
}

.post-single a, .page-single a,.sidebar-area .textwidget a,.comment-content a,.woocommerce-product-details__short-description a,#tab-description a,.extra-home-content a {
  text-decoration: underline;
}

.has-avatars .wp-block-latest-comments__comment .wp-block-latest-comments__comment-excerpt, .has-avatars .wp-block-latest-comments__comment .wp-block-latest-comments__comment-meta{
  margin-left: 0px;
}

.wp-block-button__link{
  background: var(--first-color);
}

.tag-title h3, .tag-title h1{
  overflow-wrap: anywhere;
}
.blocks-gallery-grid:not(.has-nested-images){
	padding: 6px;
}

.feature-header{
  position: relative;
  background-color: #000;
}
.feature-header img {
  width: 100%;
  height: 300px !important;
  object-fit: cover;
  opacity: 0.9;
}
h1.post-title.feature-header-title{
  color: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  word-break: break-all;
}

/* ===============================================
   HEADER BOX
   ============================================= */
.social-links i{
  color: var(--third-color);
}
.top-header a.signup-btn {
  padding: 7px 25px;
  color: var(--second-color);
  border: 0.5px solid var(--second-color);
  font-size: 14px;
  font-weight: 400;
  border-radius: 30px;
}
.top-header a.signup-btn:hover{
  background: var(--first-color);
  border-color: var(--first-color);
}
.top-header p,.sign-button a {
  color: var(--third-color);
  font-size: 14px;
  font-weight: 400;
}
.top-header p i,.social-links i:hover{
  background: var(--first-color);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}
.social-links span {
  color: var(--third-color);
  margin-right: 15px;
}
.inner-header-box {
  border: 1px solid var(--second-color);
  border-radius: 50px;
  padding: 0px 20px;
}
/*.page-template-frontpage .inner-header-box::after {
  content: "";
  position: absolute;
  bottom: 0px;
  right: -35px;
  width: 4%;
  z-index: -1;
  height: 100%;
  background: var(--third-color);
  clip-path: polygon(0 0, 100% 0, 58% 100%, 0 100%);
}
.page-template-frontpage .inner-header-box::before {
  content: "";
  position: absolute;
  bottom: 0px;
  left: -35px;
  width: 4%;
  z-index: -1;
  height: 100%;
  background: var(--third-color);
  clip-path: polygon(0 0, 100% 0, 100% 100%, 58% 100%);
}*/
.main-header-box {
  position: relative;
  width: 100%;
  z-index: 999;
  right: 0;
  padding: 20px 0px;
  left: 0;
  background: var(--third-color);
}
.page-template-frontpage .top-header p {
  margin-left: 52px;
}
.page-template-frontpage .social-links {
  margin-right: 15px;
}
.sign-button a.signin-box{
  background: var(--first-color);
  color: var(--second-color);
  font-size: 14px;
  font-weight: 400;
  padding: 8px 25px;
  border: 1px solid var(--first-color);
  border-radius: 30px;
}
.sign-button a.signup-box{
  padding: 10px 25px;
  border-radius: 3px;
}
.sign-button a.signin-box:hover,
.sign-button a.signup-box:hover{
  background: #fff;
  color: var(--second-color);
}

/* ===============================================
   LOGO BOX
   ============================================= */
 img.custom-logo {
    height: 70px;
    width: 70px;
}

.logo a {
  color: var(--second-color);
  letter-spacing: 1px;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 25px;
  line-height: 35px;
  text-decoration: none;
  -webkit-transition: color .1s linear;
  -moz-transition: color .1s linear;
  -o-transition: color .1s linear;
  transition: color .1s linear;
}
.logo span {
  display: block;
  font-size: 15px;
  line-height: 18px;
  color: #fff;
}

/* ===============================================
   HEADER SEARCH
   =============================================== */

.header-search .search-form {
	position:fixed;
	top:0;
	right:-100%;
	width:100%;
	height:100%;
	padding:0;
	z-index:1001;
	visibility: hidden;
	-webkit-transition-property: all , -webkit-transform;
    transition-property: all , transform;
    -webkit-transition-duration: 0.5s;
    transition-duration: 0.5s;
    -webkit-transition-timing-function: cubic-bezier(0.7,0,0.3,1);
    transition-timing-function: cubic-bezier(0.7,0,0.3,1);
	background: rgba(255,255,255, 0.98) none repeat;
	border:none !important;
}
.header-search .search-form.is-open {
	right:0;
	height:100%;
	visibility: visible;
}
.header-search .search-form.is-open form {
  position: absolute;
  width: 100%;
  top: 50%;
  transform: translateY(-50%);
  padding: 0 50px;
}
.header-search .search-form a.close-search-form {
	top:50px;
	position:absolute;
	margin-left:-13px;
	left:50%;
}
.header-search .search-form i.searchform-close-button {
	font-size:25px;
	color:#616161 !important;
	opacity:0;
	-webkit-transition: transform .2s linear;
	-moz-transition: transform .2s linear;
	-o-transition: transform .2s linear;
	transition: transform .2s linear;
}
.header-search .search-form.is-open i.searchform-close-button {
	opacity:1;
}
.header-search .search-form.is-open i.searchform-close-button:hover {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}

/* ===============================================
   MENU BOX
   ============================================= */

#main-menu {
	display:block;
	position:relative;
	float:left;
	margin:0 auto;
	width:100%
}
#main-menu ul {
	margin:0;
  padding: 0;
	display:block;
}
#main-menu ul li {
	position:relative;
	display:block;
	float:left;
	text-align:left;
}
#main-menu ul li a {
	text-decoration:none;
	display:block;
	z-index:1;
  padding: 15px 10px;
	margin:0;
	color: var(--second-color);
	font-size: 15px;
  font-weight: 400;
	-webkit-transition: color .1s linear, background-color .1s linear;
	-moz-transition: color .1s linear, background-color .1s linear;
	-o-transition: color .1s linear, background-color .1s linear;
	transition: color .1s linear, background-color .1s linear;
	position:relative;
}
#main-menu a:hover,
#main-menu ul li a:hover,
#main-menu li:hover > a,
#main-menu a:focus,
#main-menu ul li a:focus,
#main-menu li.focus > a,
#main-menu li:focus > a,
#main-menu ul li.current-menu-item > a,
#main-menu ul li.current_page_item > a,
#main-menu ul li.current-menu-parent > a,
#main-menu ul li.current_page_ancestor > a,
#main-menu ul li.current-menu-ancestor > a {
	color: var(--first-color);
}
li.menu-item-has-children:after {
	color: var(--first-color);
	content: ' ▾';
	position: absolute;
  top: 15px;
	right: 15px;
}
#main-menu ul li a{
  margin-right: 30px;
}
#main-menu ul.children ,
#main-menu ul.sub-menu {
	opacity: 0;
	position: absolute;
	top: 50px;
	left: -9999em;
  background: var(--first-color);
	z-index: 10001;
	width: 213px;
	padding-left: 0;
	-webkit-transition: opacity 0.3s ease 0s;
	-moz-transition: opacity 0.3s ease 0s;
	-o-transition: opacity 0.3s ease 0s;
	transition: opacity 0.3s ease 0s;
}
#main-menu ul.children li ,
#main-menu ul.sub-menu li {
	position:relative;
	margin:0;
	line-height:1.2em;
	text-transform:none;
	width:213px;
	min-height: inherit;
	margin:0;
}
#main-menu li li:hover > ul,
#main-menu li li:focus > ul,
#main-menu li li.focus > ul {
	top:0px;
	left: -100%;
}
#main-menu ul.children li a, #main-menu ul.sub-menu li a,
#main-menu ul.children li a:hover, #main-menu ul.sub-menu li a:hover{
  color: #ffffff !important;
}
#main-menu ul.children li a ,
#main-menu ul.sub-menu li a {
	text-decoration:none;
	text-align:left;
	display:block;
	padding:20px 15px;
	margin:0;
	border:none;
	line-height:inherit;
}
#main-menu ul.children li a:hover,
#main-menu ul.sub-menu li a:hover{
  background-clip: text;
  -webkit-text-fill-color: black;
  background: none !important;
  color: #000 !important;

}
#main-menu ul.children li ul:before,
#main-menu ul.sub-menu li ul:before,
.menu-toggle,
.dropdown-toggle,
button.close-menu {
	display:none;
}
#main-menu li:hover > ul,
#main-menu li:focus > ul,
#main-menu li.focus > ul {
	opacity:1;
	left: 0;
}

/* ===============================================
   POST BOX
   ============================================= */

.post-box{
  border: 1px solid rgba(0, 0, 0, 0.125);
}
.post-thumbnail {
  line-height: 0;
}
h3.post-title {
  font-size: 20px;
}
.post-content p{
	color: #898d94;
}
.post-content{
	word-wrap: break-word;
}
.post-meta i{
	color: var(--first-color);
}
.post-meta span {
  text-decoration: none;
  text-transform: capitalize;
  font-size: 15px;
  font-weight: 600;
  color: #62646c;
}
pre {
	display: block;
	padding: 9.5px;
	margin: 0 0 10px;
	font-size: 13px;
	line-height: 1.42857143;
	color: var(--third-color);
	white-space: break-spaces;
	background-color: #f5f5f5;
	border: 1px solid #ccc;
  	border-radius: 4px;
}
.post-content img,
.post-thumbnail img,
.post-content iframe,
.post-content object,
.post-content embed {
	max-width: 100%;
}
.post-content img,
.post-thumbnail img {
	max-height:100%;
	height:auto;
	width: 100%;
	object-fit: cover;
}
.post-content:after {
  content: "";
  display: table;
  clear: both;
}
#content,footer {
  float: left;
  width: 100%;
}

/*
===================================================================================
    02. Related post CSS
===================================================================================
*/

.related-post-thumbnail img {
    height: 225px;
    object-fit: cover;
    width: 100%;
}

.related-post-thumbnail {
    box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.2);
    padding: 15px;
}

.related-post-item h4.post-title {
    word-wrap: break-word;
}

/* ===============================================
   Slider
   ============================================= */

.blog_box p {
  color: var(--second-color);
  font-weight: 400;
  font-size: 15px;
}
.blog_box .third-words{
  color: var(--first-color);
}
.list-box {
  position: relative;
}
.list-content {
  border: 1px solid var(--second-color);
  border-radius: 10px;
  padding: 25px 20px 15px 20px;
  position: relative;
}
.list-content p{
  font-size: 14px;
  font-weight: 400;
  color: var(--second-color);
  position: relative;
}
.list-content p:after {
  content: "";
  border-bottom: 1px solid var(--second-color);
  width: 45%;
  height: 20px;
  position: absolute;
  bottom: -9px;
  left: 0px;
}
.list-content p:last-child::after {
  display: none;
}
img.inner-banner {
  width: 420px;
  height: 420px;
  border-radius: 50%;
  position: relative;
  border: 10px solid var(--third-color);
}
.banner-right{
  position: relative;
}
.banner-right:before {
  content: "";
  width: 70%;
  height: 1px;
  z-index: 0;
  position: absolute;
  bottom: 28%;
  right: 0px;
  left: -26.8%;
  background: #525252;
  border-radius: 50%;
}
.slider-circle-box:after {
  content: "";
  width: 1px;
  height: 34px;
  z-index: -1;
  position: absolute;
  bottom: -34px;
  right: 0px;
  margin: 0 auto;
  left: 0px;
  background: #525252;
  border-radius: 50%;
}
.banner-right:after {
  content: "";
  width: 420px;
  height: 420px;
  z-index: -1;
  position: absolute;
  top: 0px;
  right: 18%;
  background: var(--first-color);
  border-radius: 50%;
}
.slider-circle-box {
  position: absolute;
  top: 50%;
  background: var(--third-color);
  width: 115px;
  height: 115px;
  display: flex;
  left: 36%;
  border-radius: 50%;
  text-align: center;
  flex-direction: column;
  align-content: center;
  justify-content: center;
  transform: translateY(-50%);
}
.form-box input.email {
  border: 1px solid var(--second-color);
  border-radius: 10px;
  padding: 7px 16px;
  width: 45%;
}
.form-box{
  position: relative;
}
.form-box input.wpcf7-form-control.wpcf7-submit {
  background: var(--first-color);
  padding: 8px 20px;
  border: 0px;
  margin-left: -20px;
  border-radius: 10px;
  z-index: 2;
  position: absolute;
  top: 0px;
  right: 41%;
}
.form-box input.email::placeholder{
  font-size: 12px;
  font-weight: 400;
  color: var(--second-color);
  letter-spacing: 1px;
}
.slider-circle-box h4 {
  font-size: 35px;
  font-weight: 700;
  color: var(--first-color);
}
.slider-circle-box p {
  font-size: 12px;
  font-weight: 500;
  line-height: 15px;
  color: #525252;
}
.banner-right {
  text-align: right;
}
.list-image{
  position: relative;
  z-index: 1;
}
img.banner-list {
  width: 300px;
  height: 180px;
  margin-top: -47px;
  margin-left: -69px;
}
.list-icon {
  background: var(--first-color);
  border-radius: 30px;
  padding: 10px;
  color: #000;
  display: inline-block;
  position: absolute;
  z-index: 1;
  left: 20px;
  top: -3px;
}
.blog_box h4 {
  font-size: 45px;
  font-weight: 400;
  color: var(--second-color);
}
.blog_inner_box img{
  height: 600px;
  object-fit: cover;
}
.blog_inner_box{
  position: relative;
}
/*.blog_box {
  position: absolute;
  top: 60%;
  transform: translateY(-50%);
  right: 12%;
  left: 51%;
}*/
.blog_box h3 {
  font-size: 42px;
  font-weight: 600;
  color: var(--third-color);
}
p.slider-button a {
  background: var(--first-color);
  padding: 14px 25px;
  color: #fff;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 1px;
}
p.slider-button a:hover{
	background: var(--third-color);
}
p.slider-button a.slider-2-btn{
  background: var(--third-color);
  color: #090A14;
}
p.slider-button a.slider-2-btn:hover{
  background: var(--first-color);
  color: var(--third-color);
}
.slider .owl-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  right: 0;
}
.slider button.owl-prev,.slider button.owl-next {
  color: #fff !important;
  letter-spacing: 5px;
	position: absolute;
  text-align: center;
}
.slider button.owl-prev i, .slider button.owl-next i {
  padding: 15px;
  border-radius: 50%;
  color: #fff;
  border: 2px solid var(--third-color);
  background: var(--first-color);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}
.slider button.owl-prev:hover i, .slider button.owl-next:hover i{
	border: 2px solid var(--first-color);
	color: #fff;
}
.slider button.owl-prev:hover ,.slider button.owl-next:hover{
  color: var(--first-color) !important;
}
.slider button.owl-prev{
  left: 50px;
  text-align: center;
}
.slider button.owl-next{
	right: 50px;
}

/* ===============================================
   About Us
  ============================================= */
#hot_products .product-btn{
  padding: 10px 15px;
  border-radius: 6px;
  background: #f5f5f5;
  position: relative;
  color: #727489;
  border: 1px solid #ededed;
  width: 80%;
  margin: 0 auto;
  text-align: center;
  text-align: left;
}
#hot_products .product-cat {
  border-radius: 6px;
  background: #f5f5f5;
  color: #727489;
  border: 1px solid #ededed;
  list-style: none;
  position: absolute;
  width: 76%;
  z-index: 999;
  left: 0px;
  text-align: left;
  right: 0px;
  margin: 0 auto;
}
#hot_products .product-btn i,#hot_products li.drp_dwn_menu i {
  text-align: right;
  float: right;
  margin: 3px 0;
}
#hot_products .product-cat-main{
  position: relative;
  text-align: center;
}
#hot_products li.drp_dwn_menu {
  border-bottom: 1px solid #ededed;
  padding: 14px;
}
#hot_products li.drp_dwn_menu:hover{
  background: var(--first-color);
}
#hot_products li.drp_dwn_menu:hover a,#hot_products li.drp_dwn_menu:hover i{
  color: #fff;
}
#hot_products li.drp_dwn_menu a{
  color: #727489;
}
#hot_products input.search-field{
  padding: 10px 15px;
  border-radius: 6px;
  background: #f5f5f5;
  color: #727489;
  border: 1px solid #ededed;
}
#hot_products input.search-field::placeholder{
  color: #727489;
}
#hot_products button.search-button{
  padding: 14px 15px;
  border-radius: 6px;
  background: #f5f5f5;
  color: #727489;
  margin-left: 40px;
  border: 1px solid #ededed;
  cursor: pointer;
}
div#hot_products {
  background: #32BBE51F;
}
#hot_products .tab-product .product-image img {
  width: 100%;
  height: 400px;
  border-radius: 6px;
  object-fit: cover;
}
#hot_products h6 {
  font-size: 18px;
  font-weight: 600;
  background: var(--first-color);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
  display: inline-block;
}
#hot_products .about-main-content h3 {
  font-size: 35px;
  font-weight: 400;
  color: var(--second-color);
  position: relative;
  display: inline-block;
}
#hot_products .about-main-content h3:after {
  content: "";
  position: absolute;
  bottom: 0px;
  right: 0px;
  width: 104px;
  height: 20px;
  z-index: -1;
  background: url(assets/images/vector.png);
}
#hot_products .about-main-content p{
  font-size: 12px;
  font-weight: 400;
  color: var(--second-color);
}
.about-main-content {
  width: 34%;
  margin: 0 auto;
}
.about-right h3 {
  font-size: 14px;
  font-weight: 700;
  color: var(--second-color);
  font-family: "Poppins", sans-serif;
}
.about-right p {
  font-size: 13px;
  font-weight: 400;
  color: var(--second-color);
}
.about-button a {
  background: var(--first-color);
  padding: 8px 25px;
  border-radius: 8px;
  text-decoration: underline;
  color: #fff;
  font-size: 12px;
  font-weight: 500;
}
.about-button a:hover,.form-box input.wpcf7-form-control.wpcf7-submit:hover{
  background: var(--second-color);
  color: var(--first-color);
}
#hot_products img.inner-about1 {
  width: 400px;
  height: 400px;
  border-radius: 50%;
}
.about-left{
  position: relative;
}
.inner-about2 {
  width: 300px;
  height: 300px;
  border: 5px solid var(--third-color);
  margin-left: -73px;
  border-radius: 50%;
  position: absolute;
  top: 20px;
}
.circle-box {
  position: absolute;
  bottom: 6%;
  background: var(--first-color);
  width: 115px;
  height: 115px;
  right: 43%;
  display: flex;
  border-radius: 50%;
  text-align: center;
  flex-direction: column;
  align-content: center;
  justify-content: center;
  border: 5px solid var(--third-color);
}
.about-right span.dashicons,.about-right span.dashicons:before {
  color: var(--first-color);
  font-size: 40px;
  width: 50px !important;
  height: 50px !important;
}
.circle-box h4 {
  font-size: 35px;
  font-weight: 700;
  color: var(--third-color);
}
#hot_products .circle-box p {
  font-size: 12px;
  font-weight: 500;
  line-height: 15px;
  color: var(--third-color);
}
.tab-section ul{
  text-align: right;
  padding: 0;
}
#hot_products .tab-section button{
  border: none;
  background: transparent;
  cursor: pointer;
}
#hot_products .product-tab{
  float: unset;
  position: relative;
  display: inline-block;
  padding: 0px 5px;
}
#hot_products button.tablinks {
  font-size: 14px;
  color: var(--third-color);
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 2px;
}
#hot_products .tabcontent.active {
  display: block;
}
#hot_products .tabcontent{
  display: none;
}
#hot_products button:hover {
  transition: all 0.2s;
}
#hot_products button.tablinks.active {
  border-bottom: solid 2px;
  z-index: 99;
}
#hot_products .tablinks:hover {
  border-bottom: solid 2px;
  transition: all 0.2s;
  z-index: 99;
}
#hot_products h4.product-text {
  font-size: 18px;
  font-weight: 600;
}
#hot_products h4 a:hover{
	color: var(--first-color);
}
#hot_products h5.price {
  font-size: 15px;
  color: var(--first-color);
  font-weight: bold;
}
#hot_products .button2{
  display: inline-block;
  padding: 10px 20px;
  margin: 30px 0;
  text-align: center;
  color: #ffff;
  transition: all 0.2s;
  text-decoration: none;
  border-radius: 6px;
  text-transform: uppercase;
  background: var(--first-color);
  font-weight: 400;
  font-size: 14px;
}
#hot_products .button2,
#hot_products .button2::after{
  -webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
  -o-transition: all 0.3s;
	transition: all 0.3s;
}
#hot_products .button2::before,
#hot_products .button2::after{
	background: var(--first-color);
  content: '';
  position: absolute;
  z-index: -1;
  border-radius: 6px;
}
#hot_products .button2:hover{
  color: #fff;
  background: #090a14;
}
#hot_products .button2::after{
  height: 100%;
  left: 0;
  top: 0;
  width: 0;
  background: #090a14;
}
#hot_products .button2:hover:after{
  width: 100%;
}

#hot_products .icon {
  background: #f5f5f5;
  width: 35px;
  height: 35px;
  padding: 5px;
  border-radius: 6px;
  display: inline-block;
  color: var(--second-color);
  border: 1px solid #cbcdcd;
  text-align: center;
  position: relative;
  -o-transition: all .5s;
  -webkit-transition: all .5s;
  -moz-transition: all .5s;
  transition: all .5s;
  -webkit-font-smoothing: antialiased;
  cursor: pointer;
}
.cart-button{
  position: relative;
}
#hot_products .icon .button1 a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart {
  color: var(--second-color);
  background: #f5f5f5;
  font-weight: 600;
  position: absolute;
  bottom: 0;
  right: -25px;
  width: 100px;
  padding: 10px 10px;
  z-index: 1;
  font-size: 14px;
  border-radius: 6px;
  visibility: hidden;
  opacity: 0;
  -o-transition: all .5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  -webkit-transition: all .5scubic-bezier(0.68, -0.55, 0.265, 1.55);
  -moz-transition: all .5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  transition: all .5scubic-bezier(0.68, -0.55, 0.265, 1.55);
}
#hot_products .icon .button1 a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart:before {
  content:'';
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid #cbcdcd;
  position:absolute;
  bottom:-5px;
  left:50px;
}
#hot_products .cart-button:hover .button1 a.button.product_type_simple.add_to_cart_button.ajax_add_to_cart {
  bottom:40px;
  visibility:visible;
  opacity:1;
  width: 100px;
}
#hot_products .icon::before {
  font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f07a";
}
#hot_products  .product-details{
  display: flex;
}
#hot_products .icon:before{
  z-index: 99;
  position: relative;
  background: var(--first-color);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
#hot_products a.added_to_cart.wc-forward {
  position: absolute;
  transform: translateY(-30%);
  bottom: 28px;
  width: 100px;
  padding: 10px;
  background: #f5f5f5;
  color: var(--second-color);
  font-weight: 600;
  z-index: 3;
  right: -25px;
  border-radius: 6px;
  font-size: 14px;
}
#hot_products a.added_to_cart.wc-forward:before {
  content:'';
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid #cbcdcd;
  position:absolute;
  bottom:-5px;
  left:50px;
}
#hot_products figure{
	margin: 0;
	padding: 0;
	background: var(--third-color);
	overflow: hidden;
  border-radius: 6px;
}
#hot_products figure:hover+span{
	opacity: 1;
}
#hot_products figure img{
	webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
	width: 100%;
	height: auto;
}
#hot_products .product-image:hover figure img{
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
	opacity: 0.5;
}
.product-image{
	position: relative;
}

/*===============================================
   Footer Social Icons
=============================================== */

.copy-text a.social-links {
    margin-left: 14px;
}
.copy-text a:hover{
  color: var(--second-color);
}

/*===============================================
   PRELOADER
=============================================== */

.cssloader {
  padding-top: calc(45vh - 25px);
  position: fixed;
  width: 100%;
  height: 100%;
  top:0;
  right: 0;
  left: 0;
  bottom: 0;
  background: #212121;
  z-index: 99999;
}

.sh1 {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 50px 50px 0 0;
  border-color: #354952 transparent #ffffff transparent;
  margin: 0 auto;
  animation: shk1 1s ease-in-out infinite normal;
}

.sh2 {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 0 50px 50px;
  border-color: transparent  transparent var(--first-color) transparent ;
  margin: -50px auto 0;
  animation: shk2 1s ease-in-out infinite alternate;
}

/** animation starts here **/
@keyframes shk1 {
  0% {
    transform: rotate(-360deg);
  }

  100% {
  }
}

@keyframes shk2 {
  0% {
    transform: rotate(360deg);
  }
  100% {
  }
}
.lt {
  color: #fff;
  margin: 30px auto;
  text-align: center;
  font-weight: 100;
  letter-spacing: 10px;
}

/*--------------------------------*/
.loader-main {
    top: 10px;
    position: relative;
    left: -70px;
}
.triangle35b {
  position:absolute;
  transform-origin:bottom center;
  left:50%;
  top:50%;
  margin: 0 auto;
  width:110px;
  height:55px;
  clip-path:polygon(0% 0%,100% 0%,50% 100%);
  animation:animTriangle35b 3s linear infinite;
}
@keyframes animTriangle35b {
  0%,14% { transform:rotate(calc(0deg + var(--angle))); }
  25%,39% { transform:rotate(calc(90deg + var(--angle))); }
  50%,64% { transform:rotate(calc(180deg + var(--angle))); }
  75%,89% { transform:rotate(calc(270deg + var(--angle))); }
  100% { transform:rotate(calc(360deg + var(--angle))); }
}
.triangle35b:nth-child(1) {
  --angle:0deg;
  background:var(--first-color);
  animation-delay:0.4s;
}
.triangle35b:nth-child(2) {
  --angle:90deg;
  background:#fff;
  animation-delay:0.2s;
}
.triangle35b:nth-child(3) {
  --angle:180deg;
  background:var(--first-color);
}

/* ===============================================
   sticky header
   =============================================== */

	 .fixed-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999999;
}
	 .admin-bar .fixed-header{
		margin-top: 32px;
}

/* ===============================================
 STICKY POST
 =============================================== */

.post-box.sticky {
  background: #eee;
  border: none;
  box-shadow: 2px 2px 10px 2px #ccc;
}

/* ===============================================
   Pagination
   ============================================= */

.pagination,
.glass-artifact-pagination {
	margin:25px 0;
}

.pagination .nav-links a,
.pagination .nav-links span.current,
.glass-artifact-pagination a span,
.glass-artifact-pagination span.current {
	display:inline-block;
	text-decoration: none;
	padding:10px 12px;
	font-size:14px;
	line-height:21px;
	color:#333;
	text-align:center;
	vertical-align:middle;
	cursor:pointer;
	background:#f3f4f7;
	position:relative;
	margin:0;
	-webkit-transition: background-color .3s ease;
	-moz-transition: background-color .3s ease;
	-ms-transition: background-color .3s ease;
	-o-transition: background-color .3s ease;
	transition: background-color .3s ease;
}

.pagination .nav-links a:hover,
.pagination .nav-links a:focus,
.pagination .nav-links span.current,
.glass-artifact-pagination span.current,
.glass-artifact-pagination span.current:hover,
.glass-artifact-pagination span.current:focus,
.glass-artifact-pagination a span:hover,
.glass-artifact-pagination a span:focus {
	background: var(--first-color);
	color: #fff;
}

.woocommerce nav.woocommerce-pagination ul li span.current {
    background: var(--first-color);
    color: #fff;
}

/*--------------------------------------------------------------
## Comments
--------------------------------------------------------------*/
.comment-reply a:focus{
  color: #fff;
}
.comment-respond input#submit:hover,
.comment-reply a:hover{
	background: var(--third-color);
	color: #fff;
}
.comment-form-url input,nav.navigation.pagination{
  width: 100%;
}
.comment-respond input#submit {
  background: var(--first-color);
  border: none;
  color: #fff;
  padding: 10px;
  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;
}
.comment-content.card-block {
  padding: 15px;
}
.comment-reply a {
  background: var(--first-color);
  padding: 5px 15px;
  color: #fff;
}
.sidebar-area  .wp-block-latest-comments__comment-meta{
	float: none;
	background: transparent;
}
.sidebar-area .wp-block-latest-comments__comment-meta a{
	color: #2f3235;
}
ol.wp-block-latest-comments{
	padding: 0;
}
.sidebar-area .wp-block-latest-comments__comment li {
  margin-bottom: 0;
}
.sidebar-area a:hover{
  color: var(--third-color);
}
.sidebar-area a{
  text-decoration: underline;
}

.footer-area a:hover{
  color: var(--second-color);
}



/* ===============================================
   Breadcrumbs
   =============================================== */

.bread_crumb a:hover{
    color:var(--first-color);
}
.bread_crumb a{
    color: #fff;
    cursor: pointer;
    font-size: 17px;
    font-weight: 600;
    text-transform: capitalize;
    padding: 10px;

}
.bread_crumb span {
  color: var(--first-color) ;
    cursor: pointer;
    font-size: 17px;
    font-weight: 600;
    text-transform: capitalize;
     padding: 10px;
}
.bread_crumb {
    color: #fff;
    position: absolute;
    width: 100%;
    top: 65%;
}

/* ===============================================
   SIDEBARS
   =============================================== */

.sidebar-area .textwidget img{
  width: 100%;
  height: auto;
}
.sidebar-area .sidebar-widget {
	margin-bottom: 25px;
}
.sidebar-area a,
.sidebar-area p,
.sidebar-area li,
.sidebar-area address,
.sidebar-area dd,
.sidebar-area blockquote,
.sidebar-area td,
.sidebar-area th,
.sidebar-area .textwidget {
	line-height:1.9em;
	font-weight: normal;
}
.sidebar-area ul,#calendar_wrap,.sidebar-area .textwidget,.tagcloud {
  list-style: none;
  margin: 0;
  padding: 0 0px;
}
.sidebar-area li a,
.sidebar-area li {
  font-size: 15px;
  font-weight: 500;
  word-wrap: break-word;
}
.sidebar-area li {
  padding-bottom: 5px;
}
.sidebar-area h4.title, .sidebar-area h1.wp-block-heading,  
.sidebar-area h2.wp-block-heading,  
.sidebar-area h3.wp-block-heading,  
.sidebar-area h4.wp-block-heading,  
.sidebar-area h5.wp-block-heading,  
.sidebar-area h6.wp-block-heading,
.sidebar-area .wp-block-search__label {
  padding: 20px 15px;
  color: #fff;
  font-size: 18px;
  background: var(--first-color);
  border-left: solid 5px #33302d;
}
#sidebar .sidebar-area a {
  color: var(--second-color) !important;
}
.footer-area h4.title, .footer-area h1.wp-block-heading,  
.footer-area h2.wp-block-heading,  
.footer-area h3.wp-block-heading,  
.footer-area h4.wp-block-heading,  
.footer-area h5.wp-block-heading,  
.footer-area h6.wp-block-heading,
.footer-area .wp-block-search__label{
	background: none !important;
	border-left: none;
}
footer .wp-block-search__label, footer .sidebar-area h1.wp-block-heading, footer .sidebar-area h2.wp-block-heading, footer .sidebar-area h3.wp-block-heading, footer .sidebar-area h4.wp-block-heading, footer .sidebar-area h5.wp-block-heading, footer .sidebar-area h6.wp-block-heading{
	background: none !important;
	border-left: none !important;
  padding: 20px 0px !important;
  color: #fff !important;
  font-size: 25px !important; 
}
.wp-block-search__inside-wrapper {
  margin-top: 10px;
}

footer .wp-block-search__label, footer .sidebar-area h1.wp-block-heading, footer .sidebar-area h2.wp-block-heading, footer .sidebar-area h3.wp-block-heading, footer .sidebar-area h4.wp-block-heading, footer .sidebar-area h5.wp-block-heading, footer .sidebar-area h6.wp-block-heading{
	background: none !important;
	border-left: none !important; 
}
footer .sidebar-area form {
	padding: 0px;
}
.sidebar-area .wp-block-search__button {
  background: var(--first-color);
}

.sidebar-area .tagcloud a, p.wp-block-tag-cloud a {
  font-size: 15px !important;
  background: var(--first-color);
  color: #fff;
  padding: 5px;
  padding-top: 5px;
  padding-right: 5px;
  padding-bottom: 5px;
  padding-left: 5px;
  display: inline-block;
  margin: 5px 0;
  text-decoration: none;
}
.sidebar-area .tagcloud a:hover{
	background: var(--third-color);
}
.sidebar-area form {
  padding: 15px 0px;
}
.sidebar-area select,
.sidebar-area textarea, #comments textarea,
.sidebar-area input[type="text"], #comments input[type="text"],
.sidebar-area input[type="password"],
.sidebar-area input[type="datetime"],
.sidebar-area input[type="datetime-local"],
.sidebar-area input[type="date"],
.sidebar-area input[type="month"],
.sidebar-area input[type="time"],
.sidebar-area input[type="week"],
.sidebar-area input[type="number"],
.sidebar-area input[type="email"],
.sidebar-area input[type="url"],
.sidebar-area input[type="search"],
.sidebar-area input[type="tel"],
.sidebar-area input[type="color"],
.sidebar-area .uneditable-input,
#comments input[type="email"],
#comments input[type="url"]{
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
	width:100%;
	padding: 5px 2%;
	border: solid 1px var(--first-color);
}
#wp-calendar th,
#wp-calendar
#today,
#wp-calendar
#today a {
	background:#f3f4f7;
	color:#434343 !important;
}
#wp-calendar a:hover {
	border:none;
}
#wp-calendar {
	background: #fff;
	width:100%;
}
#wp-calendar caption {
	font-size: 14px;
	text-transform:uppercase;
	margin:0 0 10px 0;
	text-align:left;
}
#wp-calendar th,
#wp-calendar td {
	text-align: center;
	font-size: 14px;
	color:#434343 !important;
	padding:3px 6px;
}
#wp-calendar td a {
	display:block;
	text-align: center;
	font-size: 14px;
	color:#434343 !important;
	text-decoration:underline
}
#wp-calendar td#prev a,
#wp-calendar td#prev a{
	text-decoration:none;
	text-align:left;
}
#wp-calendar th{
	font-weight:bold
}
tr:nth-child(2n+2) {
	background-color: #f3f4f7;
}
#footer-widgets caption {
    color: #fff;
}
#footer-widgets h4 {
    margin-bottom: 30px;
    font-weight: 600;
}
.searchform label {
	display: block;
}
.searchform input[type=text] {
  width: calc(100% - 110px);
  margin: 0;
  padding: 12px;
  float: left;
  background-color: #f3f4f7;
  border: none;
}
.searchform input[type=submit] {
	background: var(--first-color);
	border: none;
	color: #fff;
	font-size:14px;
	font-weight: 600;
	text-align:center;
	position:relative;
	float:left;
	text-shadow:none;
	padding:14px 0;
	width:100px;
	margin:0 auto;
	cursor: pointer;
	-webkit-transition: color .3s ease, background-color .3s ease;
	-moz-transition: color .3s ease, background-color .3s ease;
	-o-transition: color .3s ease, background-color .3s ease;
	transition: color .3s ease, background-color .3s ease;
}

.searchform input[type=submit]:hover ,
.searchform input[type=submit]:focus {
	background-color:var(--first-color);
	text-decoration:none
}

.searchform:after {
  content: "";
  display: table;
  clear: both;
}

footer {
	background: var(--first-color);
}

footer .sidebar-area {
	background: none;
	padding: 25px 0 0 0;
}

.wp-block-group__inner-container h2 {
    color: #fff;
}

footer a,
footer p,
footer .sidebar-area li,
footer .sidebar-area address,
footer .sidebar-area dd,
footer .sidebar-area blockquote,
footer .sidebar-area td,
footer .sidebar-area th,
footer .sidebar-area .title,
footer .sidebar-area .textwidget {
	color: #fff;
}

.footer-area ul {
  padding: 0;
}

.footer-area h4.title {
  padding: 0;
  font-size: 30px;
  font-weight: 500;
  background: transparent;
  border: none;
}

img.size-auto,
img.size-full,
img.size-large,
img.size-medium,
img.alignleft,
img.alignright,
img.aligncenter,
.attachment img {
	max-width:100%;
	height:auto;
}
.alignleft,
img.alignleft {
	display:inline;
	float:left;
	margin-right:24px;
	margin-top:4px;
}
.alignright,
img.alignright {
	display:inline;
	float:right;
	margin-left:24px;
	margin-top:4px;
}
div.aligncenter,
img.aligncenter {
	display: block;
	margin-left: auto !important;
	margin-right: auto !important;
	float:none;
}
img.alignleft,
img.alignright,
img.aligncenter {
	margin-bottom:12px;
}

.wp-caption {
	background:#f1f1f1;
	line-height:18px;
	margin-bottom:25px;
	max-width:100% !important;
	padding:4px;
	text-align:center;
}

.wp-caption img {
	margin:5px 5px 0;
	width:96%;
	height:100%
}

.wp-caption p.wp-caption-text {
	color:#888;
	font-size:12px;
	margin:5px;
}

.scroll-up {
  position: fixed;
  bottom: 12px;
  right: 30px;
  z-index: 999;
}
.scroll-up a {
	background: var(--first-color);
	color:#000;
}
.scroll-up a:hover{
	background: var(--third-color);
	color:var(--first-color);
}
.scroll-up a {
  display: block;
  height: 2.5rem;
  width: 2.5rem;
  text-align: center;
  line-height: 2;
  border-radius: 3px;
  font-size: 1.25rem;
  color: #fff;
  opacity: 1;
  transition: all 0.3s ease 0s;
  box-shadow: 0 0 10px rgb(0 0 0 / 20%);
}
.scroll-up span {
  top: 7px;
  position: absolute;
  left: 7px;
  font-size: 25px;
  font-weight: 600;
}

.sticky {
}

.gallery-caption {
}

.bypostauthor {
}
