/* Theme Name: Hefz Kala Theme URI: https://HefzTeam.ir Author: رسول محمدی خانقاه Author URI: https://Rasoolmohammadi.ir Description: این قالب در دوره طراحی قالب طراحی شده Version: 1.0 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Text Domain: HefzKala */ @font-face { font-family: KalamehWeb; font-style: normal; font-weight: 100; src: url('assets/fonts/woff2/KalamehWeb-Thin.woff2') format('woff2'), /* FF39+,Chrome36+, Opera24+*/ url('assets/fonts/woff/KalamehWeb-Thin.woff') format('woff'); /* FF3.6+, IE9, Chrome6+, Saf5.1+*/ } @font-face { font-family: KalamehWeb; font-style: normal; font-weight: 200; src: url('assets/fonts/woff2/KalamehWeb-ExtraLight.woff2') format('woff2'), /* FF39+,Chrome36+, Opera24+*/ url('assets/fonts/woff/KalamehWeb-ExtraLight.woff') format('woff'); /* FF3.6+, IE9, Chrome6+, Saf5.1+*/ } @font-face { font-family: KalamehWeb; font-style: normal; font-weight: 300; src: url('assets/fonts/woff2/KalamehWeb-Light.woff2') format('woff2'), /* FF39+,Chrome36+, Opera24+*/ url('assets/fonts/woff/KalamehWeb-Light.woff') format('woff'); /* FF3.6+, IE9, Chrome6+, Saf5.1+*/ } @font-face { font-family: KalamehWeb; font-style: normal; font-weight: 500; src: url('assets/fonts/woff2/KalamehWeb-Medium.woff2') format('woff2'), /* FF39+,Chrome36+, Opera24+*/ url('assets/fonts/woff/KalamehWeb-Medium.woff') format('woff'); /* FF3.6+, IE9, Chrome6+, Saf5.1+*/ } @font-face { font-family: KalamehWeb; font-style: normal; font-weight: 600; src: url('assets/fonts/woff2/KalamehWeb-Semibold.woff2') format('woff2'), /* FF39+,Chrome36+, Opera24+*/ url('assets/fonts/woff/KalamehWeb-Semibold.woff') format('woff'); /* FF3.6+, IE9, Chrome6+, Saf5.1+*/ } @font-face { font-family: KalamehWeb; font-style: normal; font-weight: 800; src: url('assets/fonts/woff2/KalamehWeb-ExtraBold.woff2') format('woff2'), /* FF39+,Chrome36+, Opera24+*/ url('assets/fonts/woff/KalamehWeb-ExtraBold.woff') format('woff'); /* FF3.6+, IE9, Chrome6+, Saf5.1+*/ } @font-face { font-family: KalamehWeb; font-style: normal; font-weight: 900; src: url('assets/fonts/woff2/KalamehWeb-Black.woff2') format('woff2'), /* FF39+,Chrome36+, Opera24+*/ url('assets/fonts/woff/KalamehWeb-Black.woff') format('woff') /* FF3.6+, IE9, Chrome6+, Saf5.1+*/ } @font-face { font-family: KalamehWeb; font-style: normal; font-weight: bold; src: url('assets/fonts/woff2/KalamehWeb-Bold.woff2') format('woff2'), /* FF39+,Chrome36+, Opera24+*/ url('assets/fonts/woff/KalamehWeb-Bold.woff') format('woff'); /* FF3.6+, IE9, Chrome6+, Saf5.1+*/ } @font-face { font-family: KalamehWeb; font-style: normal; font-weight: normal; src: url('assets/fonts/woff2/KalamehWeb-Regular.woff2') format('woff2'), /* FF39+,Chrome36+, Opera24+*/ url('assets/fonts/woff/KalamehWeb-Regular.woff') format('woff'); /* FF3.6+, IE9, Chrome6+, Saf5.1+*/ } body { font-family: KalamehWeb !important; direction: rtl; margin: 0; background-color: #f4f4f4; } h1, h2, h3, h4, h5, h6{ font-family: KalamehWeb !important; } .wrapper { max-width: 900px; margin: 20px auto; padding: 30px; background-color: #fff; border-radius: 15px; box-shadow: 0 0 10px #aaa; } html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } a{ text-decoration: none; } table { border-collapse: collapse; border-spacing: 0; } header{ width: 1230px; box-shadow: 0 0 15px #cdcdcd; height: 80px; border-radius: 50px; display: block; margin: 20px auto; position: relative; background-color: #fff; } .btnsearch{ width: 50px; height: 50px; border-radius: 100%; box-shadow: 0 0 10px #8e17d1; background: url(assets/img/search.svg),linear-gradient(45deg, #b333ef, #7a07c1); background-repeat: no-repeat; background-position: center; position: absolute; top:50%; left: 15px; transform: translateY(-50%); } .kitkala-basket{ width: 50px; height: 50px; border-radius: 100%; border: 1px solid #16c10e; box-shadow: 0 0 10px rgba(22, 193, 14, 35%); background: url(assets/img/basket.png),#fff; background-repeat: no-repeat; background-position: center; position: absolute; top:50%; left: 75px; transform: translateY(-50%); } .registerbtn{ width: 150px; height: 45px; background: linear-gradient(45deg,#05baff,#0574ff); display: inline-block; border-radius: 30px; position: absolute; top:50%; left: 140px; transform: translateY(-50%); text-align: center; line-height: 45px; color: #fff; font-family:KalamehWeb; box-shadow: 0 0 15px rgba(5, 116, 255, 35%); } .main-menu{ float: right; margin: 20px 40px 20px 0px; } .main-menu > ul > li{ float: right; margin-left: 20px; position: relative; } .main-menu ul li a{ color: #716060; font-size: 18px; padding: 10px 15px; display: block; } .main-menu ul li a:hover{ background: linear-gradient(45deg,#05baff,#0574ff); color: #fff; border-radius: 8px; box-shadow: 0 0 15px rgba(5, 116, 255, 35%); } .main-menu ul li ul{ width: 240px; height: auto; background-color: #fff; border-radius: 5px; box-shadow: 0 0 15px #d4d4d4; position: absolute; visibility: hidden; z-index: 999; } .main-menu ul li ul li{ position: relative; } .main-menu ul li ul li ul{ top: 0; right: 100%; position: absolute; } .main-menu ul li:hover > ul{ visibility: visible; } .main-menu ul li ul li a{ border-radius: 0px !important; font-size: 15px; line-height: 25px; border-bottom: 1px solid #efefef; } .logo img{ margin-right: 20px; margin-top: 12px; float: right; } .kitkala-center{ width: 1230px; display: block; margin: 0 auto; } .left-banner{ float: left; width: 293px; height: 300px; border-radius: 8px; } .left-banner img{ max-width: 100%; border-radius: 8px; height: 100%; } .home-slider{ background: purple; float: right; width: 915px; height: 300px; margin-left: 20px; border-radius: 8px; } .home-slider img{ width: 100%; height:300px; border-radius: 8px; } /* slider */ .swiper-button-prev:after, .swiper-rtl .swiper-button-next:after{ color: #fff; } .clear{ width: 100%; height: 1px; float: none; clear: both; } .banner-container{ margin-top: 20px; } .banner-item{ width: calc(25% - 15px); margin-left: 20px; float: right; } .banner-item:last-child{ margin-left: 0px; } .banner-item img{ max-width: 100%; border-radius: 8px; } .suggest-product{ float: left; width: 253px; height: 360px; background-color: #fff; box-shadow: 0 0 15px #d3d3d3; margin-top: 20px; border-radius: 8px; padding: 20px; position: relative; } .kitkala-suggest-title{ font-size: 18px; font-weight: 700; color: #484747; padding-bottom: 10px; border-bottom: 2px solid #d4d4d4; } .suggest-product-image{ width: 235px; height: 175px; display: block; margin: 16px auto; } .title-product{ font-size: 16px; color: #484747; text-align: center; width: 80%; display: block; line-height: 25px; margin: 0 auto; } .sug-product-price{ color: #ff5757; font-size: 18px; display: block; margin: 8px auto; text-align: center; } .add-to-cart{ color: #ff5757; border: 1px solid; padding: 10px 50px; border-radius: 25px; display: block; box-shadow: 0 0 10px #ffd0d0; position: relative; } .add-to-cart::after{ width: 30px; height: 30px; content: ""; background:url(assets/img/add-to-cart.png), #ff5757; background-repeat: no-repeat; background-position: center; display: inline-block; border-radius: 100%; position: absolute; top: 3px; left: 4px; } .kitkala-suggest-title::after{ content: ""; height: 2px; width: 40%; background: #ff5757; display: block; position: absolute; top: 48px; } .discount-box{ float: right; width: 915px; background-color: #fff; box-shadow: 0 0 15px #d3d3d3; height: 300px; margin-top: 20px; border-radius: 8px; } .discount-column img{ width: 250px; height: 250px; padding: 20px; } .sale-percent{ width: 40px; height: 40px; border-radius: 100%; box-shadow: 0 0 15px rgba(255, 31, 39, 35%); background-image: linear-gradient(45deg,#ff5757,#ff0f1a); color: #fff; line-height: 40px; margin: 15px 15px 0 -55px; float: right; position: relative; } .discount-column{ float: right; width: calc(33% - 6px); height: 100%; } .regular-price{ background: #dcdcdc; border-radius: 25px; padding: 2px 10px; margin-left: -25px; padding: 2px 10px 2px 30px; color: #474444; position: relative; } .regular-price::after{ content: ""; height: 1px; width: 80%; background: #ff5757; display: inline-block; position: absolute; right: 8px; top: 13px; transform: rotate(-12deg); } .sale-price{ background: #ff5757; color: #fff; border-radius: 25px; padding: 2px 15px; z-index: 99; position: relative; } .product-prices{ margin-top: 30px; } .discount-column.content{ padding-right: 25px; } .discount-column .product-title{ margin-top: 35px; color: #484747; font-weight: 700; font-size: 22px; } .sort-desc{ margin-top: 25px; color: #484747; line-height: 2; } .sugeest-time{ position: relative; display: contents; } .text-suggest-time{ position: absolute; top: 50%; left:135px; transform: translateY(-50%); } .wonderful-suggest{ font-size: 18px; font-weight: 700; color: #474444; line-height: 2; display: block; } .until-time{ color: #474444; } .countdown{ position: absolute; top: 75%; transform: translateY(-50%); width: 100%; direction: ltr; left: 60px; } .countdown div{ display: inline-block; } .countdown .no{ background-color: #dcdcdc; width: 50px; height: 50px; border-radius: 15px; display: block; text-align: center; line-height: 50px; color: #474444; font-size: 18px; margin-left: 5px; } .countdown .txt{ text-align: center; display: block; margin-top: 6px; color:#474444; } .second .no{ background-color: #ff5757; color: #fff; } .swiper-pagination{ top: 23% !important; right: 92% !important; direction: ltr; } .swiper-pagination-bullet{ border-radius: 20px !important; width: 40px !important; height: 16px !important; color: #515151; background: #dcdcdc !important; opacity: 1 !important; padding: 3px 5px; font-size: 14px; line-height: 16px; } .swiper-pagination-bullet-active{ background: #ff5757 !important; color: #fff; width: 45px !important; } .kitkala-feature{ background: #fff; width: 915px; height: 80px; border-radius: 8px; box-shadow:0 0 15px #d3d3d3; float: right; margin-top: 20px; } .kitkala-feature div{ display: flex; } .feature{ width: 152.5px; font-size: 13px; text-align: center; } .feature img{ display: block; margin: 10px auto; } .most-sell-title{ color: #5d5b5b; font-size: 18px; font-weight: 700; margin: 20px 10px; display: inline-block; width: 100%; } .most-sell-title::before{ content: ""; width: 35px; height: 35px; background: url(assets/img/laptop.png); display: inline-block; background-repeat: no-repeat; background-position: center; vertical-align: middle; margin-left: 10px; opacity: 0.8; } .most-sell-title::after{ content: ""; width: 81%; height: 2px; background-color: #5d5b5b; display: inline-block; margin-right: 10px; } .inner-item-product{ width: clac(100% - 40px); display: inline-block; background: #fff; box-shadow:0 0 15px #d3d3d3; border-radius: 8px; padding:10px 20px; } .inner-item-product .item-product{ width: 20%; height: auto; float: right; text-align: center; } .item-product img{ max-width: 100%; } .item-product h3{ padding: 5px 35px; line-height:1.5; color: #626262; } .item-product span{ color:#ff5757; line-height: 2; } .home-middle-banner{ width: 100%; margin: 20px 0; } .home-middle-banner .adl-banner{ float: left; width: 49%; } .home-middle-banner .adl-banner img,.home-middle-banner .adr-banner img{ max-width: 100%; border-radius: 8px; } .home-middle-banner .adr-banner{ float: right; width: 49%; } .home-art-title{ color: #5d5b5b; font-size: 18px; font-weight: 700; margin: 20px 10px; display: inline-block; width: 100%; } .home-art-title::before{ content: ""; width: 35px; height: 35px; background: url(assets/img/article.png); display: inline-block; background-repeat: no-repeat; background-position: center; vertical-align: middle; margin-left: 10px; opacity: 0.8; } .home-art-title::after{ content: ""; width: 83%; height: 2px; background-color: #5d5b5b; display: inline-block; margin-right: 10px; } .home-box-article{ width: 100; } .article-item{ width: calc(20% - 28px); height: auto; background: #fff; border-radius: 8px; box-shadow: 0 0 15px #d3d3d3; padding: 10px; margin-left: 10px; float: right; } .article-item:last-child{ margin-left: 0; } .article-item img{ max-width: 100%; height: 150px; } .article-item h3{ color: #424141; line-height: 1.5; margin:10px 0 20px 0; font-size: 15px; } .article-item .author a{ background: linear-gradient(45deg, #9b35fa, #60afff); border-radius: 25px; padding: 2px 10px; color: #fff; font-size: 13px; } .article-item .publish-date{ float: left; color: #6a6a6a; font-size: 13px; } .article-item .publish-date::before{ width: 25px; height: 25px; content: ""; display: inline-block; background: url(assets/img/clock.png); background-repeat: no-repeat; background-position: center; vertical-align: text-bottom; margin-left: 2px; } .home-brand-title{ color: #5d5b5b; font-size: 18px; font-weight: 700; margin: 20px 10px; display: inline-block; width: 100%; } .home-brand-title::before{ content: ""; width: 35px; height: 35px; background: url(assets/img/brand.png); display: inline-block; background-repeat: no-repeat; background-position: center; vertical-align: middle; margin-left: 10px; opacity: 0.8; } .home-brand-title::after{ content: ""; width: 87%; height: 2px; background-color: #5d5b5b; display: inline-block; margin-right: 10px; } .home-brands{ width:100%; background: #fff; border-radius: 100px; box-shadow: 0 0 15px #cdcdcd; } .center-item{ display: flex; } .brand-item{ border-radius: 100%; box-shadow: 0 0 15px #cdcdcd; width: 120px; height: 120px; position: relative; margin: 20px auto; } .brand-item img{ position: absolute; top: 50%; left: 15%; transform: translateY(-50%); } footer{ background: #333333; width: 100%; margin-top: 20px; padding-top: 20px; border-top: 5px solid #8ac3ffd1; } .feature-footer img{ display: block; margin: 0 auto; border-radius: 25px; } .footer-column{ width: 25%; float: right; margin-right: 100px; margin-top: 20px; } .footer-column p{ color: #fff; line-height: 3; } .footer-column h1 ,.footer-column h2 ,.footer-column h3,.footer-column h4 ,.footer-column h5 ,.footer-column h6{ font-weight: bold; font-size: 19px; color: #fff; line-height: 4; } .footer-column ul li a{ color: #fff; line-height: 3; } .copyright-text{ text-align: center; } .copyright-text p{ background: #fff; display: inline-block; line-height: 2; border-radius: 20px 20px 0 0; padding: 5px 30px; box-shadow: 0 0 18px #ffffff87; margin-top: 20px; color: #333333; } .breadcrumb{ background: #fff; height: 40px; border-radius: 50px; box-shadow: 0 0 15px #cdcdcd; padding-right: 20px; line-height: 40px; color: #8e8d8d; font-size: 15px; margin-bottom: 20px; } .pages-content{ background: #fff; border-radius: 8px; float: right; width: 870px; padding: 20px; } aside{ width: 300px; border-radius: 8px; float: left; } .page-title{ font-size: 20px; font-weight: bold; color: #665e5e; border-bottom: 2px solid #ececec; padding-bottom: 15px; } .short-decs{ line-height: 2 !important; } .pages-content p{ line-height: 3; color: #9a9a9a; margin-top: 20px; text-align: justify; } aside img{ max-width: 100%; height: auto; border-radius: 8px; } .sidebar-related-post{ background: #fff; border-radius: 8px; box-shadow: 0 0 15px #cdcdcd; max-width: 100%; height: auto; margin-top: 20px; padding: 20px; margin-bottom: 20px; } .last-post-title{ font-size: 18px; font-weight: bold; color: #737373; border-bottom: 1px solid #e2e2e2; display: block; padding-bottom: 10px; } .title-post{ display: inline-block; vertical-align: middle; color: #737373; margin-top: 15px; width: 65%; line-height: 1.5; } .sidebar-related-post img{ margin-top: 20px; vertical-align: middle; width: 60px; height: 60px; border-radius: 5px; margin-left: 10px; } .thumbnail-image{ float: right; width: 50%; } .thumbnail-image img{ border-radius: 10px; max-width: 100%; } .specification-post{ float: left; width: calc(50% - 20px); padding-right: 20px; } .category-post{ background: #c0dcff; padding: 7px 15px; border-radius: 5px; color: #5aa3fd; margin: 20px 0 20px 20px; display: inline-block; } .post-title{ font-size: 22px; font-weight: bold; color: #665e5e; } .meta-info{ margin-top: 20px; } .meta-info span{ margin-left: 40px; color: #9a9a9a; } .comment::before{ content: ""; background: url(assets/img/comment.png); display: inline-block; background-repeat: no-repeat; width: 25px; height: 25px; vertical-align: bottom; margin-left: 5px; } .publish-date::before{ content: ""; background: url(assets/img/date.png); display: inline-block; background-repeat: no-repeat; width: 25px; height: 25px; vertical-align: bottom; margin-left: 5px; } .author-name::before{ content: ""; background: url(assets/img/author.png); background-repeat: no-repeat; display: inline-block; width: 25px; height: 25px; vertical-align: bottom; margin-left: 5px; } .inner-content{ border-top: 2px solid #ececec; margin-top: 15px; } .content404{ text-align: center; } .title404{ font-size: 40px; font-weight: 900; color: #386fc1; margin: 55px 0 40px 0; } .content404 p{ font-size: 18px; color: #313132; margin: 40px 0 30px 0; } .gotohome{ background: linear-gradient(45deg, #005fe6, #00aeff); padding: 12px 65px; border-radius: 25px; box-shadow: 0 0 20px #41bcff91; color: #fff; font-weight: 700; margin-bottom: 50px; display: inline-block; } .archive-content{ float: right; width: 910px; } .archive-content .item{ width: calc(25% - 8px); margin: 0 6px 20px 2px; background: #fff; text-align: center; padding: 20px 0; border-radius: 8px; box-shadow: 0 0 15px #dfdfdf; float: right; } .archive-content .item img{ max-width: 100%; } .archive-title{ color: #3f3d3d; line-height: 1.5; width: 80%; display: block; margin: 10px auto; } .readmore{ background: linear-gradient(45deg, #005fe6, #00aeff); border-radius: 8px; padding: 12px 55px; color: #fff; box-shadow: 0 0 15px #52a4ffcf; display: inline-block; font-size: 14px; } .archive-main-title{ text-align: right; display: inline-block; font-size: 22px; font-weight: bold; margin-bottom: 15px; } .price-product{ color: #ff5353; margin: 12px auto; display: block; } .add-to-cart-category{ background: linear-gradient(45deg, #005fe6, #00aeff); border-radius: 8px; padding: 12px 40px; color: #fff; box-shadow: 0 0 15px #52a4ffcf; display: inline-block; font-size: 14px; }