@charset "UTF-8"; @font-face { font-family: vazirmatn; src: url(../fonts/vazirmatn.woff2); font-display: swap; } :root { --font-regular: vazirmatn, sans-serif; --bs-body-font-family-regular: var(--font-regular); --bs-body-font-size75: 0.75rem; --bs-body-h-font-size15: 1.5rem; --bs-body-h-font-size14: 1.4rem; --bs-body-h-font-size13: 1.3rem; --bs-body-h-font-size12: 1.2rem; --bs-body-h-font-size11: 1.1rem; --bs-body-h-font-weight: 800; --bs-body-font-size: 1rem; --bs-body-line-height: 2; --color-default: #1a1f24; --color-default-rgb: 26, 31, 36; --color-links: #3279fc; --color-links-hover: #4797ff; --color-green-links-hover: #c26972; --color-primary: #3279fc; --color-primary-light: #4797ff; --color-primary-dark: #1c61e2; --color-primary-rgb: 50, 121, 252; --color-primary-light-rgb: 71, 151, 255; --color-primary-dark-rgb: 28, 97, 226; --color-secondary: #5670a0; --color-secondary-light: #6e87b6; --color-secondary-dark: #3b5380; --color-secondary-rgb: 86, 112, 160; --color-secondary-light-rgb: 110, 135, 182; --color-secondary-dark-rgb: 59, 83, 128; --color-blue: #0d6efd; --color-blue-rgb: 13, 110, 253; --color-indigo: #6610f2; --color-indigo-rgb: 102, 16, 242; --color-purple: #6f42c1; --color-purple-rgb: 111, 66, 193; --color-pink: #f3268c; --color-pink-rgb: 243, 38, 140; --color-red: #df1529; --color-red-rgb: 223, 21, 4; --color-orange: #f75937; --color-orange-rgb: 253, 126, 20; --color-yellow: #ffc107; --color-yellow-rgb: 255, 193, 7; --color-green: #059652; --color-green-rgb: 5, 150, 82; --color-teal: #20c997; --color-teal-rgb: 32, 201, 151; --color-cyan: #0dcaf0; --color-cyan-rgb: 13, 202, 240; --color-white: #ffffff; --color-white-rgb: 255, 255, 255; --color-gray: #6c757d; --color-gray-rgb: 108, 117, 125; --color-dark-gray: #111111; --color-dark-gray-rgb: 17, 17, 17; --color-black: #000000; --color-black-rgb: 0, 0, 0; --color-darkBlue: #3546ae; --color-darkBlue-rgb: 53, 70, 174; --shadow-box: rgba(0, 0, 0, .1) 0px 0px 10px 0px !important; --color-dark-gradient: linear-gradient(90deg, #111111 0%, #1b1c1f 100%); --color-red-gradient: linear-gradient(90deg, #d13a3f 0%, #ff000a 100%); --color-blue-gradient: linear-gradient(90deg, #766e6e 0%, #2e5aff 100%); --color-grean-gradient: linear-gradient(90deg, #a0cd3a 0%, #2cbc9f 100%); --color-grean-gradient-hover: linear-gradient(90deg, #a0cd3a 0%, rgba(17, 178, 75, 0.6) 20%); scroll-behavior: smooth; --bg-darkBlue: var(--color-darkBlue); --bs-blue: var(--color-blue); --bs-indigo: var(--color-indigo); --bs-purple: var(--color-purple); --bs-pink: var(--color-pink); --bs-red: var(--color-red); --bs-orange: var(--color-orange); --bs-yellow: var(--color-yellow); --bs-green: var(--color-green); --bs-teal: var(--color-teal); --bs-cyan: var(--color-cyan); --bs-white: var(--color-white); --bs-gray: var(--color-gray); --bs-gray-dark: #343a40; --bs-gray-100: #f8f9fa; --bs-gray-200: #e9ecef; --bs-gray-300: #dee2e6; --bs-gray-400: #ced4da; --bs-gray-500: #adb5bd; --bs-gray-600: #6c757d; --bs-gray-700: #495057; --bs-gray-800: #343a40; --bs-gray-900: #212529; --bs-primary: var(--color-blue); --bs-secondary: var(--color-blue); --bs-success: #198754; --bs-info: #0dcaf0; --bs-warning: #ffc107; --bs-danger: #dc3545; --bs-light: #f8f9fa; --bs-dark: #212529; --bs-primary-rgb: var(--color-primary-rgb); --bs-secondary-rgb: var(--color-secondary-rgb); --bs-success-rgb: 25, 135, 84; --bs-info-rgb: 13, 202, 240; --bs-warning-rgb: 255, 193, 7; --bs-danger-rgb: 220, 53, 69; --bs-light-rgb: 248, 249, 250; --bs-dark-rgb: 33, 37, 41; --bs-white-rgb: var(--color-white-rgb); --bs-black-rgb: var(--color-black-rgb); --bs-body-color-rgb: var(--color-default-rgb); --bs-body-bg-rgb: 255, 255, 255; --bs-font-sans-serif: var(--font-regular); --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0)); --bs-body-color: var(--color-default); --bs-body-bg: #fff; --fc-breakpoint-xs: 0; --fc-breakpoint-sm: 576px; --fc-breakpoint-md: 768px; --fc-breakpoint-lg: 992px; --fc-breakpoint-xl: 1200px; --fc-breakpoint-xxl: 1400px; --bs-body-font-weight-800: 800; } h1, h2, h3, h4, h5, h6 { font-family: var(--font-regular); font-size: var(--bs-body-h-font-size11) } li::marker { content: ""; } html { font-size: 14px } a { color: var(--color-black); } .text-muted { --bs-text-opacity: 1; color: #000000 !important; } a:hover { color: var(--color-green-links-hover) } img, svg { vertical-align: middle; border-radius: 15px } .strong, strong { font-family: vazirmatn, serif; color: #0000FF; } .font20PX { font-size: 20px } @media (max-width: 479px) { h1, h2, h3, h4, h5, h6 { font-family: var(--font-regular); font-weight: var(--bs-body-h-font-weight); font-size: var(--bs-body-h-font-size11) } } @media (max-width: 599px) and (min-width: 480px) { h1, h2, h3, h4, h5, h6 { font-family: var(--font-regular); font-weight: var(--bs-body-h-font-weight); font-size: var(--bs-body-h-font-size11) } } @media (max-width: 799px) and (min-width: 600px) { h1, h2, h3, h4, h5, h6 { font-family: var(--font-regular); font-weight: var(--bs-body-h-font-weight); font-size: var(--bs-body-h-font-size11) } } @media (max-width: 900px) and (min-width: 800px) { h1, h2, h3, h4, h5, h6 { font-family: var(--font-regular); font-weight: var(--bs-body-h-font-weight); font-size: var(--bs-body-h-font-size11) } } section { padding: 10px 0; } .section-header p, h1, h2, h3, h4, h5, h6 { font-weight: var(--bs-body-h-font-weight); line-height: var(--bs-body-line-height) } .section-header { text-align: center; padding-bottom: 20px } .section-header h2, .section-header h3, .section-header h4 { margin-bottom: 1px; color: var(--color-black) } .section-header p { font-size: var(--bs-body-h-font-size11); margin: 0 auto; text-align: center; color: #000 } .g-0, .gx-0, .row { --fc-gutter-x: 0 } .blog .row, .g-0, .gy-0, .row { --fc-gutter-y: 0 } .page-link, a, a:hover { text-decoration: none } .breadcrumbs h1, .breadcrumbs ol { margin: 0; font-size: var(--bs-body-h-font-size12); font-family: var(--font-regular), serif; } .breadcrumbs { padding: 24px; background: #e3e3e38a; min-height: 40px; margin-top: 76px; direction: ltr } .breadcrumbs ol { flex-wrap: wrap; padding: 0 } .breadcrumbs ol li + li { padding-left: 10px } .breadcrumbs ol li + li::before { display: inline-block; padding-right: 10px; color: var(--color-secondary-light); content: "|" } .breadcrumbs ol, .nav { display: flex } .scroll-top.active { visibility: visible; opacity: 1 } .scroll-top { position: fixed; visibility: hidden; opacity: 0; right: 15px; bottom: 15px; z-index: 995; background: #f60b14; width: 40px; height: 40px; border-radius: 50%; transition: .4s } .scroll-top i { font-size: 24px; color: var(--color-white); line-height: 0 } .scroll-top:hover { background: #a4a4a4; color: var(--color-white) } .header { padding: 15px 0; transition: .5s; z-index: 997; background: #345cf7; box-shadow: 0 2px 20px rgba(var(--color-secondary-rgb), .1) } .header .logo img { max-height: 40px; margin-right: 6px; width: 90%; height: auto; } .header .btn-getstarted, .header .btn-getstarted:focus { font-size: 16px; color: var(--color-white); background: var(--color-red-gradient); padding: 8px 23px; border-radius: 4px; transition: .3s; font-family: vazirmatn, sans-serif } .header .btn-getstarted:focus:hover, .header .btn-getstarted:hover { color: var(--color-white); background: rgba(var(--color-red-rgb), .7) } .nav { --bs-nav-link-padding-x: 1rem; --bs-nav-link-padding-y: 0.5rem; --bs-nav-link-font-weight: ; --bs-nav-link-color: var(--bs-gray); --bs-nav-link-hover-color: var(--bs-gray-dark); --bs-nav-link-disabled-color: #6c757d; flex-wrap: wrap; padding-right: 0; margin-bottom: 0; font-weight: var(--bs-body-font-weight-800) } .nav, .section-header p { font-family: var(--font-regular) } @media (min-width: 1280px) { .section-header p { max-width: 80% } .navbar, .navbar li { position: relative } .navbar { padding: 0 } .navbar ul { margin: 0; padding: 0; display: flex; list-style: none; align-items: center } .navbar > ul > li { white-space: nowrap } .navbar a, .navbar a:focus { direction: ltr; display: flex; align-items: center; justify-content: space-between; padding: 14px 20px; font-family: vazirmatn, sans-serif; font-size: 16px; font-weight: 400; color: white; white-space: nowrap; transition: .3s; position: relative } .navbar a i, .navbar a:focus i { font-size: 12px; line-height: 0; margin-left: 5px } .navbar > ul > li > a:before { content: ""; position: absolute; width: 100%; height: 2px; bottom: 0; left: 0; background-color: var(--color-gray); visibility: hidden; transition: .3s ease-in-out; transform: scaleX(0) } .navbar .active:before, .navbar a:hover:before, .navbar li:hover > a:before { visibility: visible; transform: scaleX(.7) } .navbar .active, .navbar .active:focus, .navbar a:hover, .navbar li:hover > a { color: var(--color-black); border-radius: 20px 20px 0 0; } .navbar .dropdown .active:before, .navbar .dropdown a:hover:before, .navbar .dropdown:hover > a:before { visibility: hidden } .navbar .dropdown .active, .navbar .dropdown .active:focus, .navbar .dropdown a:hover, .navbar .dropdown ul .active, .navbar .dropdown ul .active:hover, .navbar .dropdown ul a:hover .navbar .dropdown:hover > a { color: #000000; background: #ffffff; border-radius: 20px 20px 0 0; } .navbar .dropdown ul li:hover > a { background: rgb(239 80 81); border-radius: 10px; color: white; } .navbar .dropdown ul { display: block; position: absolute; right: 0; top: 100%; margin: 0; padding: 10px 10px; z-index: 99; opacity: 0; visibility: hidden; background: var(--color-white); transition: .3s; border: 1px solid #e7e7e7; border-radius: 20px 0 0 20px; } .navbar .dropdown ul li { min-width: 200px } .navbar .dropdown ul a { padding: 10px 20px; font-size: 15px; text-transform: none; font-weight: 400; color: rgba(var(--color-black-rgb), 1); direction: rtl } .navbar .dropdown ul a i { font-size: 12px } .navbar .dropdown:hover > ul { opacity: 1; visibility: visible } .navbar .dropdown .dropdown ul { top: 0; right: calc(100% - 0px); visibility: hidden } .navbar .dropdown .dropdown:hover > ul { opacity: 1; top: 0; visibility: visible } } @media (min-width: 1280px) and (max-width: 1366px) { .navbar .dropdown .dropdown ul { left: -90% } .navbar .dropdown .dropdown:hover > ul { left: -100% } } @media (max-width: 1279px) { .header .btn-getstarted, .header .btn-getstarted:focus { margin-right: 80px } .navbar { position: fixed; top: 0; left: -100%; width: calc(100% - 100px); bottom: 0; transition: .7s; z-index: 9997 } .navbar ul { position: absolute; inset: 0; padding: 10px 0; margin: 0; background: rgb(237 237 237); overflow-y: auto; transition: .3s; z-index: 9998 } .navbar a, .navbar a:focus { display: flex; align-items: center; justify-content: space-between; padding: 9px 6px; margin-left: 30px; margin-right: 30px; font-size: 0.9em; font-weight: 700; color: rgba(var(--color-black-rgb), .7); white-space: nowrap; border-bottom: 1px solid #e9eaea; } .navbar a i, .navbar a:focus i { font-size: 12px; line-height: 0; margin-left: 5px } .navbar .active, .navbar .active:focus, .navbar a:hover, .navbar li:hover > a { } .navbar .dropdown .dropdown ul, .navbar .dropdown ul { position: static; display: none; padding: 10px 0; transition: .5s ease-in-out; background: #f5f5f5 } .navbar .dropdown .dropdown > .dropdown-active, .navbar .dropdown > .dropdown-active { display: block } .mobile-nav-toggle { display: block !important; color: #0c0d0f; font-size: 38px; cursor: pointer; line-height: 0; transition: .5s; position: fixed; top: 20px; z-index: 9999; right: 28px } .mobile-nav-toggle.bi-x { color: var(--color-white) } .mobile-nav-active { overflow: hidden; z-index: 9995; position: relative } .mobile-nav-active .navbar { left: 0 } .mobile-nav-active .navbar:before { content: ""; position: fixed; inset: 0; background: rgb(140 140 140 / 72%); z-index: 9996; } } .colorWhite, .features .nav-link.active h4, .footer .footer-legal .credits a, .ourServices .container p, .ourServices .container ul, .phoneCase .content h1 { color: var(--color-white) } .footer span { font-family: var(--font-regular), serif; font-weight: bold; font-size: var(--bs-body-h-font-size12) } #printerServices .row, #printers .row, .blog .row, .row { margin-left: calc(var(--fc-gutter-x) * -.5); margin-right: calc(var(--fc-gutter-x) * -.5); margin-top: calc(var(--fc-gutter-y) * -1) } .blog .row { --fc-gutter-x: 10px; display: flex; flex-wrap: wrap } .blog img { border: 2px solid gray; } .footer { color: var(--color-black); font-size: 14px; box-shadow: var(--shadow-box) } .footer .footer-content { background: var(--bs-white); padding: 60px 0 30px } .footer .footer-content .footer-info, .footer .footer-content .footer-links { margin-bottom: 30px } .footer .footer-content .footer-info p { font-size: 14px; line-height: 24px; margin-bottom: 0; font-family: vazirmatn, sans-serif; color: var(--color-black) } .footer .footer-content .footer-links ul { list-style: none; padding: 0; margin: 0 } .footer .footer-content .footer-links ul i { padding-right: 2px; color: var(--color-black); font-size: 12px; line-height: 1 } .footer .footer-content .footer-links ul li { padding: 10px 0; align-items: center } .footer .footer-content .footer-links ul li:first-child { padding-top: 0 } .footer .footer-content .footer-links ul a { color: rgba(var(--color-black), .9); transition: .3s; display: inline-block; line-height: 1 } .footer .footer-legal { padding: 30px 0; background: var(--color-dark-gradient) } .footer .footer-legal .credits { padding-top: 4px; font-size: 13px; color: var(--color-white) } .footer .footer-legal .social-links a { font-size: 18px; display: inline-block; background: rgba(var(--color-white-rgb), .1); color: var(--color-white); line-height: 1; padding: 8px 0; margin-right: 4px; border-radius: 4px; text-align: center; width: 36px; height: 36px; transition: .3s } .footer .footer-legal .social-links a:hover { background: #6c757d; text-decoration: none } @media (min-width: 300px) and (max-width: 800px) { .footer .footer-content .footer-info, .footer .footer-content .footer-links { margin-bottom: 30px; text-align: center } .footer .footer-content .footer-links ul li { padding: 10px 0; align-items: center; text-align: center } } [data-aos^=fade][data-aos^=fade], [data-aos^=zoom][data-aos^=zoom] { opacity: 0; transition-property: opacity, transform } [data-aos^=fade][data-aos^=fade].aos-animate { opacity: 1; transform: translateZ(0) } [data-aos=fade-up] { transform: translate3d(0, 100px, 0) } @font-face { font-display: block; font-family: bootstrap-icons; src: url("./fonts/bootstrap-icons.woff2?24e3eb84d0bcaf83d77f904c78ac1f47") format("woff2"), url("./fonts/bootstrap-icons.woff?24e3eb84d0bcaf83d77f904c78ac1f47") format("woff") } .bi::before, [class*=" bi-"]::before, [class^=bi-]::before { display: inline-block; font-family: bootstrap-icons, serif !important; font-style: normal; font-weight: 400 !important; font-variant: normal; text-transform: none; line-height: 1; vertical-align: -.125em; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale } .bi-arrow-up-short::before { content: "\f145" } .bi-chevron-down::before { content: "\f282" } .bi-chevron-right::before { content: "\f285" } .bi-chevron-up::before { content: "\f286" } .bi-door-open::before { content: "\f308" } .bi-facebook::before { content: "\f344" } .bi-instagram::before { content: "\f437" } .bi-linkedin::before { content: "\f472" } .bi-list::before { content: "\f479" } .bi-telegram::before { content: "\f5b3" } .bi-twitter::before { content: "\f5ef" } .bi-x::before { content: "\f62a" } ::-webkit-scrollbar { width: 15px } ::-webkit-scrollbar-track { box-shadow: inset 0 0 5px grey; border-radius: 10px } ::-webkit-scrollbar-thumb { background: #ab3536; border-radius: 10px } ::-webkit-scrollbar-thumb:hover { background: #ef5051; } .row { display: flex; flex-wrap: wrap } .row > * { flex-shrink: 0; margin-top: var(--fc-gutter-y); max-width: 100%; padding-left: calc(var(--fc-gutter-x) * .5); padding-right: calc(var(--fc-gutter-x) * .5); width: 100% } .col-12, .row-cols-1 > * { flex: 0 0 auto; width: 100%; } .img-zoom, div.zoom { border-radius: .5rem; overflow: hidden } .mt-4 { margin-top: 1rem !important } .mb-3 { margin-bottom: .75rem !important } .mb-4 { margin-bottom: 1rem !important; } .mb-8 { margin-bottom: 2rem !important } .mb-10 { margin-bottom: 3rem !important; } .me-2 { margin-right: .5rem !important } .mb-2 { margin-bottom: .5rem !important } .mb-3 { margin-bottom: .75rem !important } .mb-4 { margin-bottom: 1rem !important } .mb-5 { margin-bottom: 1.25rem !important } .ms-4 { margin-left: 1rem !important } .marginButton, .marginTB { margin-bottom: 5px } .justify, .marginLeft20 { margin-left: 20px } .img-zoom img { transition: transform .5s; } .img-zoom img:hover { transform: scale(1.1) } .admin-panel .container a, .copyright strong, .table-of-content ol li a:hover { color: #fff } .justify { text-align: justify; margin-right: 20px; font-weight: 500 } .text-inherit { color: var(--fc-gray-800) } .truncateLongTexts { width: 100px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis } .cursor-pointer { cursor: pointer } .active > .page-link, .page-link.active { z-index: 3; color: var(--bs-pagination-active-color); background-color: #0277C8; border-color: #0277C8; } .page-link { position: relative; display: block; padding: var(--bs-pagination-padding-y) var(--bs-pagination-padding-x); font-size: var(--bs-pagination-font-size); color: #000; background-color: var(--bs-pagination-bg); border: var(--bs-pagination-border-width) solid var(--bs-pagination-border-color); transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out } .page-link:hover { z-index: 2; color: rgba(2, 119, 200, 0.45); background-color: var(--bs-pagination-hover-bg); border-color: var(--bs-pagination-hover-border-color) } @media (min-width: 768px) { .col-md-6, .row-cols-md-2 > * { flex: 0 0 auto; width: 50% } .col-md-8 { flex: 0 0 auto; width: 66.66666667% } .offset-md-2 { margin-left: 16.66666667% } .d-md-block { display: block !important } .d-md-flex { display: flex !important } } @media (min-width: 992px) { .col-lg-4, .row-cols-lg-3 > * { flex: 0 0 auto; width: 33.33333333% } .col-lg-3, .row-cols-lg-4 > * { flex: 0 0 auto; width: 25% } .col-lg-2, .row-cols-lg-6 > * { flex: 0 0 auto; width: 16.66666667% } .d-lg-block { display: block !important } .flex-lg-row { flex-direction: row !important } .justify-content-lg-between { justify-content: space-between !important } .align-items-lg-start { align-items: flex-start !important } .order-lg-last { order: 6 !important } .me-lg-0 { margin-right: 0 !important } .mb-lg-0 { margin-bottom: 0 !important } .mb-lg-14 { margin-bottom: 5rem !important } } section.inner-page#blog-page #pagination-bg { background-color: #fff; border-radius: 5px; padding: 10px 0; margin-top: 15px; border: 1px solid #d4d4d4; } section.inner-page#blog-page #pagination-bg .pagination li { border: none !important; border-radius: 5px !important; padding: 0 5px; } section.inner-page#blog-page #pagination-bg .pagination li a { border: none !important; border-radius: 20px; padding: 5px 10px; color: #000000 !important; font-family: var(--font-regular); font-weight: bold; } section.inner-page#blog-page #pagination-bg .page-item.active .page-link { background-color: #f4171b !important; color: #f1f1f1 !important; }