/*** General CSS ***/
body {
    line-height: 1.9em;
}

/*** Header Area ***/
/* Header Menu */
#sp-header {
    box-shadow: 0 0 4px 0 rgb(0 0 0 / 10%);
}
#sp-header.header-sticky {
    position: fixed;
    z-index: 9999;
    background: #fff;
}
.sp-megamenu-parent > li > a, .sp-megamenu-parent > li > span {
    font-weight: 500;
}
.sp-megamenu-parent .sp-dropdown li.sp-menu-item>a {
    font-size: 14px !important;
}

/* Canvas Menu */
.offcanvas-menu .offcanvas-inner .menu-child > li a {
    padding: 12px 10px !important;
    border-bottom: 1px solid rgba(197, 153, 153, 0.21);
    display: inherit;
}
.offcanvas-menu .offcanvas-inner ul.menu>li>a, .offcanvas-menu .offcanvas-inner ul.menu>li>span {
    font-size: 15px;
    font-weight: 500;
}

/*** Block Styles ***/
/* Button */
.btn {
    position: relative;
    display: inline-block;
    width: auto;
    margin: 0;
    font-weight: 500;
    font-family: inherit;
    line-height: 2em;
    letter-spacing: .02em;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 10px 34px;
    cursor: pointer;
    border: 0!important;
    text-transform: uppercase;
    color: #fff!important;
}
.btn:hover {
  	background: #222;
    box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.05), 0px 2px 2px rgba(0, 0, 0, 0.05), 0px 4px 4px rgba(0, 0, 0, 0.05), 0px 8px 8px rgba(0, 0, 0, 0.05), 0px 16px 16px rgba(0, 0, 0, 0.05);
    -webkit-transform: translateY(-1px);
    transform: translateY(-1px);
}

/* Title */
.title h2 {
    font-size: 50px;
    line-height: 1.2em;
    font-weight: 600;
}
.title p {
    max-width: 500px;
    margin: 0 auto;
}

/* Product */
.product {
    position: relative;
}
.product:before {
    content: "";
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    position: absolute;
    background-color: transparent;
    background-image: linear-gradient(180deg, rgba(0,0,0,0) 0%, #000000 70%);
    opacity: 1;
    transition: background 0.3s, border-radius 0.3s, opacity 0.3s;
}
.product-item h5 {
    position: relative;
    padding-top: 40px;
}
.product-item h5:before {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    content: "|";
    color: #fff;
}

/* Testimonial */
.testimonial-item h2 {
 	font-style: italic; 	
}

/* Contact Info */
.contact-info h2, .contact-info h3 {
	font-size: 23px;
}

/* Blog */
.jmm-item .jmm-image.mod-article-image {
  	overflow: hidden;
}
.jmm-image.mod-article-image img {
  	transform: scale(1);
  	-webkit-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
}
.jmm-item:hover .jmm-image.mod-article-image img {
  	transform: scale(1.12);
  	filter: grayscale(100%);
}

/* Footer Copyright */
div#sp-footer1 {
    text-align: center;
}

/*** Responsive Layout ***/
/* Tablet Landscape Layout */
@media (min-width: 980px) and (max-width: 1199px) {
  	.sp-megamenu-parent > li > a, .sp-megamenu-parent > li > span {
    	font-size: 13px !important;
	}
}
/* Mobile Standard Layout */
@media (max-width: 768px) {
	#sp-header, #sp-header .logo {
        height: 70px;
    }
  	#sp-footer p {
  		text-align: center;
	}
  	body #sp-header {
    	background: #fff;
      	padding: 0;
	}
}

/* Mobile Small Resolution */
@media (max-width: 480px) {
  .slider-small h3 {
    	margin-bottom: 0 !important;
  }
  .slider-big h1 {
    	padding: 0 !important;
  }
}

/* General color defination
Color value depend on preset color that picking on template settings > Presets
*/

:root {
  --background-color: currentColor;
  --background: currentColor;
  --text-color: currentColor;
}
a.hikabtn.hikacart, .btn,
.slider-item .sppb-btn-success, .sp-simpleportfolio .sp-simpleportfolio-filter>ul>li.active>a,
.sp-simpleportfolio .sp-simpleportfolio-item .sp-simpleportfolio-info:hover,
.sp-simpleportfolio .sp-simpleportfolio-item .sp-simpleportfolio-overlay-wrapper .sp-simpleportfolio-overlay,
.jmm-image.mod-article-image:before, .jmm-image.mod-article-image:after, .title h3:after {
 	background-color: var(--background-color) !important;
}
.article-list .article .readmore a:hover, .article-list .article .readmore a:active, .article-list .article .article-header h2 a:hover,
.offcanvas-menu .offcanvas-inner ul.menu >li.active a, .slider-small h3, .slider-big h1, .slider-phone h2,
.title h6, .title h2, .explore-content h4, .testimonila-carousel, .product-item h5 {
  	color: var(--text-color) !important; 
}
a.hikabtn.hikacart,
.tabs .sppb-tab-content, .tabs .sppb-nav-tabs>li.active>a, .sp-simpleportfolio .sp-simpleportfolio-filter>ul>li.active>a, .btn-primary:hover,
.btn, .counter-item, .divider, body:not(.home) #sp-header {
  	border-color:var(--text-color)!important;
}