File Editor
Directories:
.. (Back)
assets
demo
inc
languages
template-parts
Files:
404.php
archive.php
class.theme-modules.php
comments.php
footer.php
functions.php
header.php
home.php
index.php
page.php
search.php
searchform.php
sidebar.php
single-portfolio.php
single.php
style.css
template-layout-builder.php
Create New File
Create
Edit File: style.css
/*! Theme Name: Quarty | Shared by WPTry.org Theme URI: https://bslthemes.site/quarty/intro/ Author: beshleyua Author URI: https://themeforest.net/user/beshleyua Description: Quarty - Architecture & Interior WordPress Theme Requires at least: 4.8 Requires PHP: 5.2.4 Tested up to: 5.8 Version: 1.1.4 License: General Public License License URI: http://www.gnu.org/licenses/gpl.html Text Domain: quarty Tags: full-width-template, editor-style, featured-images, sticky-post, threaded-comments, translation-ready, theme-options */ /*-------------------------------------------- 0. color variable 1. common - fonts - variables - text defaults - title defaults - quote - divider - buttons - space 2. frame - preloader - top bar - symbol - logo - menu - top bar buttons - search - info bar - left bar - curtain - content - cursor - frame (after 992px) - frame (after 768px) 3. banners - half banner - half banner (after 992px) - half banner (after 768px) 4. transitions - menu in animation - menu out animation - content in animation - content out animation 5. content - about cover - counter up - team - prices - testimonials - brands - call to action - icon box - contact - blog card - table - instagram - social links - subscribe - copyright 6. portfolio - portfolio item - portfolio item (after 768px) - portfolio grid sizes - masonry grid - filter - portfolio (after 1200px) 7. plugins customization - smooth scrollbar - swiper - fancybox - mapbox --------------------------------------------*/ /* ------------------------------ common ------------------------------ */ /* ----- text defaults ----- */ *, *:after, *:before { -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-font-smoothing: antialiased; } body { margin: 0; padding: 0; font-size: 16px; font-family: "Roboto", sans-serif; font-weight: 400; letter-spacing: 0; color: #52555a; } a, a:hover { text-decoration: none; color: #52555a; } .qrt-text { line-height: 24px; letter-spacing: 0.5px; } .qrt-white { color: white !important; } .qrt-white * { color: white !important; } .qrt-text-right { text-align: right; } @media (max-width: 768px) { .qrt-sm-text-left { text-align: left; } } /* ----- title defaults ----- */ h1, h2, h3, h4, h5, h6, .title--h { font-weight: 800; color: #28292c; margin: 0; font-family: "Commissioner", sans-serif; -ms-word-wrap: break-word; word-wrap: break-word; letter-spacing: 0.5px; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, .title--h a { color: #28292c; } h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover, .title--h a:hover { color: #28292c; } h1, .title--h1 { font-size: 72px; font-weight: 800; text-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); } h2, .title--h2 { font-size: 42px; font-weight: 800; } h3, .title--h3 { font-size: 24px; font-weight: 800; } h4, .title--h4 { font-size: 18px; } h5, .title--h5 { text-transform: uppercase; letter-spacing: 2px; font-size: 12px; font-family: "Josefin Sans", sans-serif; } @media (max-width: 768px) { h1, .title--h1 { font-size: 36px; } h2, .title--h2 { font-size: 36px; } } @media (max-width: 580px) { h1, .title--h1 { font-size: 30px; } h2, .title--h2 { font-size: 30px; } } a { -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; } .qrt-just-text { padding: 40px 0; } .qrt-just-text p, .portfolio .elementor-text-editor p { margin-bottom: 20px; } .qrt-just-text p:last-child, .portfolio .elementor-text-editor p:last-child { margin-bottom: 0; } .qrt-just-text h3 { margin-bottom: 20px; } .qrt-just-img { width: 100%; } .qrt-portfolio-pagination { padding: 30px 30px 25px; background: #28292c; display: block; text-align: center; position: relative; } .qrt-portfolio-pagination:after { content: ''; display: block; clear: both; } .qrt-portfolio-pagination .qrt-pagination-center { margin-top: -9px; position: absolute; left: 0; top: 50%; height: 18px; width: 100%; text-align: center; } .qrt-portfolio-pagination .qrt-pagination-center .qrt-link { color: #fff; } .qrt-portfolio-pagination>.qrt-link:first-child { float: left; } .qrt-portfolio-pagination>.qrt-link:last-child { float: right; } .qrt-portfolio-pagination span { color: #ff7043; } .qrt-portfolio-pagination>.qrt-link { position: relative; z-index: 2; } .qrt-portfolio-pagination .qrt-link { margin: 0; } .qrt-portfolio-pagination a, .qrt-portfolio-pagination span { -webkit-transition: .4s ease-in-out; transition: .4s ease-in-out; padding: 0 5px; } /* ----- quote ----- */ blockquote { color: #52555a; font-size: 1rem; /*background: #ff7043;*/ padding: 0 50px; font-weight: 600; font-style: italic; position: relative; /*border-left: 4px solid #ff7043;*/ } .has-text-align-right { border-right: none; border-left: 0; } blockquote a { color: #28292c; } blockquote:before { position: absolute; font-family: "FontAwesome"; font-weight: 900; content: "\f10d"; font-size: 24px; line-height: 1; color: #ff7043; top: 0; left: 0; } /*blockquote:after { position: absolute; font-family: "FontAwesome"; font-weight: 900; content: "\f10d"; font-size: 18px; color: #ff7043; bottom: 0; right: 0; -webkit-transform: rotate(180deg); transform: rotate(180deg); }*/ .has-text-align-right:before { left: auto; right: -2px; -webkit-transform: scale(-1); transform: scale(-1); } /*.has-text-align-right:after { left: -2px; right: auto; -webkit-transform: scale(-1); transform: scale(-1); }*/ /* ----- divider ----- */ .qrt-divider { background: #52555a; width: 100%; margin: 40px 0; height: 1px; opacity: 0.3; } .qrt-divider.qrt-space-fix { margin: 0 0 40px; } .qrt-divider.qrt-space-fix-2 { margin: 20px 0 40px; } .qrt-divider-2 { background: #ff7043; width: 90px; margin: 0 0 20px; height: 2px; border-radius: 1px; } /* ----- buttons ----- */ .qrt-btn { cursor: pointer; font-family: "Josefin Sans", sans-serif; margin-right: 5px; border-radius: 2px; text-transform: uppercase; background-color: #28292c; color: #fff; font-size: 11px; letter-spacing: 2px; font-weight: 800; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-line-pack: center; align-content: center; border: solid 2px transparent; -webkit-box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); } .qrt-btn span { white-space: nowrap; margin: 0 5px; -ms-flex-item-align: center; align-self: center; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-btn i { display: block; font-size: 8px; margin: 0 5px 3px; -ms-flex-item-align: center; align-self: center; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-btn.qrt-btn-md { height: 45px; font-size: 11px; padding: 2px 35px 0; } .qrt-btn.qrt-btn-sm { height: 40px; font-size: 11px; padding: 1px 30px 0; } .qrt-btn:hover { color: #fff; } .qrt-btn:focus { outline: inherit; color: inherit; } .qrt-btn.qrt-btn-color { background-color: #ff7043; color: #28292c; } .qrt-btn.qrt-btn-color:hover { color: #28292c; } .qrt-btn.qrt-btn-color:focus { outline: inherit; color: #28292c; } .qrt-btn.qrt-btn-border { background-color: transparent; border-color: #fff; } .qrt-btn.qrt-btn-border:focus { outline: inherit; color: white; } .qrt-btn:hover i { -webkit-transform: translateX(4px); transform: translateX(4px); } .qrt-link { position: relative; text-transform: uppercase; font-size: 12px; display: inline-block; letter-spacing: 2px; font-weight: 800; margin-right: 15px; margin-bottom: 10px; color: #28292c; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-link:hover { color: #28292c; } .qrt-link.qrt-white-link { color: white; } .qrt-link.qrt-white-link:hover { color: white; -webkit-transform: translateX(5px); transform: translateX(5px); } .qrt-link.qrt-color-link { color: #28292c; } .qrt-link.qrt-color-link:hover { color: #28292c; } .qrt-link.qrt-w-chevron { padding-right: 10px; } .qrt-link.qrt-w-chevron:after { position: absolute; font-family: "FontAwesome"; content: '\f054'; font-weight: 900; display: inline-block; font-style: normal; font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; font-size: 8px; line-height: 13px; top: 3px; -webkit-transform: translateX(5px); transform: translateX(5px); -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-link.qrt-w-chevron:hover { -webkit-transform: translateX(0); transform: translateX(0); } .qrt-link.qrt-w-chevron:hover:after { -webkit-transform: translateX(10px); transform: translateX(10px); } .qrt-link:last-child { margin-bottom: 0; margin-right: 0; } .qrt-link i { font-size: 9px; margin-left: 3px; } .qrt-link.qrt-left-link { padding-left: 10px; padding-right: 0; } .qrt-link.qrt-left-link.qrt-w-chevron:after { content: '\f053'; left: 0; -webkit-transform: translateX(0); transform: translateX(0); } .qrt-link.qrt-left-link.qrt-w-chevron:hover:after { -webkit-transform: translateX(-4px); transform: translateX(-4px); } /* ----- space ----- */ .qrt-mr-20 { margin-right: 20px !important; } .qrt-mb-80 { margin-bottom: 80px !important; } .qrt-mb-40 { margin-bottom: 40px !important; } .qrt-mb-30 { margin-bottom: 30px !important; } .qrt-mb-20 { margin-bottom: 20px !important; } .qrt-mb-25 { margin-bottom: 25px !important; } .qrt-mb-10 { margin-bottom: 10px !important; } .qrt-mb-5 { margin-bottom: 5px !important; } .qrt-p-40-40 { padding-top: 40px; padding-bottom: 40px; } .qrt-p-0-40 { padding-bottom: 40px; } .qrt-p-40-0 { padding-top: 40px; } .qrt-d-none { display: none; } /* ------------------------------ frame ------------------------------ */ body { background-color: #1e1f22; } .qrt-app { position: relative; overflow: hidden; margin: 10px; width: calc(100vw - 20px); height: calc(100vh - 20px); border-radius: 5px; background-color: #1e1f22; -webkit-box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; /* ----- preloader ----- */ /* ----- top bar ----- */ /* ----- left bar ----- */ /* ----- curtain ----- */ /* ----- content ----- */ /* ----- cursor ----- */ } .admin-bar .qrt-app { height: calc(100vh - 52px); } .qrt-app .qrt-preloader { position: absolute; top: 0; left: 0; border-radius: 5px; background-color: #28292c; z-index: 9999999999999; width: 100%; height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .qrt-app .qrt-preloader .qrt-preloader-content { width: 200px; text-align: center; } .qrt-app .qrt-preloader .qrt-preloader-content .qrt-preloader-load svg path { stroke: rgba(255, 255, 255, 0.1); } .qrt-app .qrt-preloader .qrt-preloader-content .qrt-preloader-load svg path:last-child { stroke: #ff7043; } .qrt-app .qrt-preloader .qrt-preloader-content .qrt-logo { width: 80px; margin: 0 auto; } .qrt-app .qrt-preloader .qrt-preloader-content .qrt-logo img { width: 100%; } .qrt-app .qrt-preloader .qrt-preloader-content .progressbar-text { top: 30px !important; color: #f7f8f8 !important; } .qrt-app .qrt-top-bar { position: absolute; top: 0; left: 0; right: 0; height: 80px; width: 100%; border-radius: 5px 5px 0 0; background-color: #28292c; padding: 0 30px 0 100px; -webkit-box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); z-index: 999; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; /* ----- symbol ----- */ /* ----- logo ----- */ /* ----- menu ----- */ /* ----- top bar buttons ----- */ /* ----- search ----- */ /* ----- info bar ----- */ } .qrt-app .qrt-top-bar.qrt-top-bar-wsm { padding-left: 30px; } .qrt-app .qrt-top-bar .qrt-symbol { position: absolute; top: 0; left: 0; width: 80px; height: 80px; border-radius: 5px 0 0 0; background-color: #ff7043; -webkit-box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .qrt-app .qrt-top-bar .qrt-symbol img { width: 22px; height: 22px; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-app .qrt-top-bar .qrt-logo { margin-left: 10px; width: 80px; } .qrt-app .qrt-top-bar .qrt-logo img { width: 100%; } .qrt-app .qrt-top-bar .qrt-menu { height: 80px; font-family: "Josefin Sans", sans-serif; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; position: relative; } .qrt-app .qrt-top-bar .qrt-menu nav ul { padding: 0; margin: 0; display: -webkit-box; display: -ms-flexbox; display: flex; } .qrt-app .qrt-top-bar .qrt-menu nav ul li { position: relative; height: 80px; list-style-type: none; margin: 0 20px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .qrt-app .qrt-top-bar .qrt-menu nav ul li:first-child { margin-left: 0; } .qrt-app .qrt-top-bar .qrt-menu nav ul li:last-child { margin-right: 0; } .qrt-app .qrt-top-bar .qrt-menu nav ul li a { padding: 12px 0; display: block; text-transform: uppercase; color: #f7f8f8; font-size: 11px; font-weight: 800; letter-spacing: 2px; } .qrt-app .qrt-top-bar .qrt-menu nav ul li:after { content: ''; height: 3px; width: 0; position: absolute; bottom: 0; left: -20%; background-color: #ff7043; } .qrt-app .qrt-top-bar .qrt-menu nav ul li.current-menu-item:after { content: ''; width: 135%; } .qrt-app .qrt-top-bar .qrt-menu nav ul ul li.current-menu-item { opacity: 0.5; pointer-events: none; } .qrt-app .qrt-top-bar .qrt-menu nav ul li ul { position: relative; top: 0; left: 0; padding: 12px 0; background-color: #ff7043; min-width: 160px; border-radius: 0 0 5px 5px; -webkit-box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); display: -webkit-box; display: -ms-flexbox; display: flex; display: none; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .qrt-app .qrt-top-bar .qrt-menu nav ul li ul li { white-space: nowrap; display: inline-block; height: auto; padding: 0 25px; margin: 0; } .qrt-app .qrt-top-bar .qrt-menu nav ul li ul li a { padding: 12px 0; color: #28292c; letter-spacing: 0.5px; } .qrt-app .qrt-top-bar .qrt-menu nav ul ul li a:hover { text-decoration: underline; } .qrt-app .qrt-top-bar .qrt-menu nav ul li ul li:after { display: none; } .qrt-menu .menu-item-has-children>a:after { margin-left: 5px; position: relative; top: 0; font-family: "FontAwesome"; content: '\f054'; font-weight: 900; display: inline-block; vertical-align: middle; font-style: normal; font-variant: normal; text-rendering: auto; -webkit-font-smoothing: antialiased; font-size: 8px; line-height: 14px; -webkit-transform: rotate(90deg); transform: rotate(90deg); -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-app .qrt-top-bar .qrt-menu nav ul li ul ul { left: 98%; top: -12px; background-color: #ffde72; } @media (min-width: 769px) { .qrt-app .qrt-top-bar .qrt-menu nav ul li ul { pointer-events: none; opacity: 0; -webkit-transform: translateY(5px); transform: translateY(5px); -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; position: absolute; top: 80px; left: -25px; } .qrt-app .qrt-top-bar .qrt-menu nav ul li:hover>ul { pointer-events: all; opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); display: flex; } } .qrt-app .qrt-top-bar .qrt-buttons { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .qrt-app .qrt-top-bar .qrt-buttons .qrt-search-btn { margin-left: 5px; color: white; width: 30px; height: 30px; cursor: pointer; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .qrt-app .qrt-top-bar .qrt-buttons .qrt-search-btn i { font-size: 15px; } .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn, .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn { margin-top: 2px; padding: 8px 7px; width: 30px; height: 30px; cursor: pointer; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; text-align: center; } .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn span, .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn span:after, .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn span:before, .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn span, .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn span:after, .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn span:before { content: ""; display: block; width: 15px; height: 0.15em; border-radius: 1px; background: #f7f8f8; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn span, .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn span { position: relative; margin: 5px 0 0; } .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn span:after, .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn span:before, .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn span:after, .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn span:before { position: absolute; } .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn span:before, .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn span:before { top: -5px; } .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn span:after, .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn span:after { top: 5px; } .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn.qrt-active span, .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn.qrt-active span { -webkit-transform: rotate(45deg); transform: rotate(45deg); } .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn.qrt-active span:before, .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn.qrt-active span:before { -webkit-transform: translate(0px, 5px) rotate(-90deg); transform: translate(0px, 5px) rotate(-90deg); } .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn.qrt-active span:after, .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn.qrt-active span:after { -webkit-transform: translate(0px, -5px) rotate(-90deg); transform: translate(0px, -5px) rotate(-90deg); } .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn:hover span, .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn:hover span:after, .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn:hover span:before, .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn:hover span, .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn:hover span:after, .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn:hover span:before { background: white; } .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn.qrt-info-btn, .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn.qrt-info-btn { -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; padding-left: 0; padding-right: 0; } .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn.qrt-info-btn span, .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn.qrt-info-btn span:after, .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn.qrt-info-btn span:before, .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn.qrt-info-btn span, .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn.qrt-info-btn span:after, .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn.qrt-info-btn span:before { border-radius: 50%; width: 3px; height: 3px; } .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn.qrt-info-btn.qrt-active span, .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn.qrt-info-btn.qrt-active span:after, .qrt-app .qrt-top-bar .qrt-buttons .qrt-info-btn.qrt-info-btn.qrt-active span:before, .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn.qrt-info-btn.qrt-active span, .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn.qrt-info-btn.qrt-active span:after, .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn.qrt-info-btn.qrt-active span:before { border-radius: 1px; width: 15px; height: 0.16em; } .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn { display: none; } .qrt-app .qrt-top-bar .qrt-search { border-radius: 5px; position: absolute; top: 80px; left: 80px; width: calc(100% - 80px); height: 80px; padding: 0 20px; background-color: white; z-index: -2; -webkit-transform: translateZ(-1px) translateY(-100%); transform: translateZ(-1px) translateY(-100%); -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .qrt-app .qrt-top-bar .qrt-search form { opacity: 0; width: 100%; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; } .qrt-app .qrt-top-bar .qrt-search form input { width: 100%; height: 40px; border-radius: 30px; background-color: transparent; border: none; font-size: 14px; padding: 0 20px; color: #28292c; background-color: #cacdd2; } .qrt-app .qrt-top-bar .qrt-search form input:focus { outline: inherit; } .qrt-app .qrt-top-bar .qrt-search form input::-webkit-input-placeholder { font-size: 14px; font-family: "Josefin Sans", sans-serif; color: #28292c; opacity: 0.3; } .qrt-app .qrt-top-bar .qrt-search form input:-ms-input-placeholder { font-size: 14px; font-family: "Josefin Sans", sans-serif; color: #28292c; opacity: 0.3; } .qrt-app .qrt-top-bar .qrt-search form input::-ms-input-placeholder { font-size: 14px; font-family: "Josefin Sans", sans-serif; color: #28292c; opacity: 0.3; } .qrt-app .qrt-top-bar .qrt-search form input::placeholder { font-size: 14px; font-family: "Josefin Sans", sans-serif; color: #28292c; opacity: 0.3; } .qrt-app .qrt-top-bar .qrt-search form button { position: absolute; top: 0px; height: 40px; line-height: 40px; right: 0px; font-size: 0px; border: none; background: none; padding: 0 10px; opacity: 0; } .qrt-app .qrt-top-bar .qrt-search form button:before { content: "\f002"; font-family: 'FontAwesome'; font-size: 14px; } .qrt-app .qrt-top-bar .qrt-search.qrt-active { -webkit-transform: translateZ(-1px) translateY(0); transform: translateZ(-1px) translateY(0); border-radius: 0 0 5px 5px; } .qrt-app .qrt-top-bar .qrt-search.qrt-active form { opacity: 1; } .qrt-app .qrt-top-bar .qrt-info { overflow: scroll; position: absolute; top: 80px; right: 0; width: 350px; height: calc(100vh - 100px); background-color: #f7f8f8; -webkit-box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); z-index: -1; -webkit-transform: translateZ(-1px) translateX(100%); transform: translateZ(-1px) translateX(100%); -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .admin-bar .qrt-app .qrt-top-bar .qrt-info { height: calc(100vh - 132px); } .qrt-app .qrt-top-bar .qrt-info.qrt-active { -webkit-transform: translateZ(-1px) translateX(0); transform: translateZ(-1px) translateX(0); } .qrt-app .qrt-top-bar .qrt-info .qrt-info-frame { padding: 40px; width: 100%; height: 100%; } .qrt-app .qrt-left-bar { position: relative; z-index: 9; width: 80px; height: 100%; border-radius: 5px 0 0 5px; background-color: #28292c; -webkit-box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); } .qrt-app .qrt-left-bar .qrt-current-page-title { pointer-events: none; text-align: right; position: absolute; bottom: calc(100vh - 285px); left: -111px; height: 90px; width: 300px; font-family: "Josefin Sans", sans-serif; text-transform: uppercase; font-size: 11px; letter-spacing: 2px; font-weight: 800; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .admin-bar .qrt-app .qrt-left-bar .qrt-current-page-title { bottom: calc(100vh - 317px); } .qrt-app .qrt-left-bar .qrt-current-page-title a { display: none; color: #f7f8f8; pointer-events: none; } .qrt-app .qrt-left-bar .qrt-current-page-title a:first-child { display: block; } .qrt-app .qrt-left-bar .qrt-social-links { position: absolute; bottom: 40px; width: 80px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .qrt-app .qrt-left-bar .qrt-social-links .qrt-social-link { width: 30px; height: 30px; margin-bottom: 5px; font-size: 14px; color: #f7f8f8; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .qrt-app .qrt-left-bar .qrt-social-links .qrt-social-link:last-child { margin-bottom: 0; } .qrt-app .qrt-left-bar .qrt-social-links .qrt-social-link:hover { color: #ff7043; } .qrt-app .qrt-curtain { cursor: pointer; position: absolute; top: 0; left: 0; z-index: 1; background-color: rgba(40, 41, 44, 0.3); opacity: 0; pointer-events: none; width: 100vw; height: 100vh; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .admin-bar .qrt-app .qrt-curtain { height: calc(100vh - 32px); } .qrt-app .qrt-curtain.qrt-active { opacity: 1; pointer-events: all; } .qrt-app .qrt-content { position: relative; top: 80px; width: calc(100vw - 100px); height: calc(100vh - 100px); } .admin-bar .qrt-app .qrt-content { height: calc(100vh - 132px); } .qrt-app .qrt-content .qrt-content-frame { width: 100%; position: relative; overflow: hidden; padding: 40px; background-color: #f7f8f8; -webkit-box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); } .qrt-app .qrt-content .qrt-half-content-frame { width: 100%; position: relative; top: 0; background-color: #f7f8f8; -webkit-box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); display: -webkit-box; display: -ms-flexbox; display: flex; } .qrt-app .qrt-content .qrt-half-content-frame .qrt-left { width: calc(100% - 480px); min-height: calc(100vh - 100px); padding: 40px; position: relative; overflow: hidden; } .admin-bar .qrt-app .qrt-content .qrt-half-content-frame .qrt-left { min-height: calc(100vh - 132px); } .qrt-app .qrt-content .qrt-half-content-frame .qrt-right { margin-left: auto; position: fixed; right: 0; width: 480px; height: calc(100vh - 100px); } .admin-bar .qrt-app .qrt-content .qrt-half-content-frame .qrt-right { height: calc(100vh - 132px); } .qrt-app .qrt-cursor { z-index: 999999; position: fixed; left: 0; top: 0; pointer-events: none; will-change: transform; width: 30px; height: 30px; } .qrt-app .qrt-cursor .qrt-follower { margin-top: 3px; width: 50px; height: 50px; border-radius: 50%; -webkit-box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); opacity: 0.2; } .qrt-app .qrt-cursor .qrt-follower i { opacity: 0; } /* ----- frame (after 1200px) ----- */ @media (max-width: 1200px) { .qrt-app .qrt-content .qrt-half-content-frame { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; } .qrt-app .qrt-content .qrt-half-content-frame .qrt-left { width: 100%; } .qrt-app .qrt-content .qrt-half-content-frame .qrt-right { position: relative; height: 300px; width: 100%; } } /* ----- frame (after 992px) ----- */ @media (max-width: 992px) { .qrt-app .qrt-top-bar .qrt-buttons .qrt-send-request { display: none; } } /* ----- frame (after 768px) ----- */ @media (max-width: 768px) { .qrt-app { margin: 0; width: 100vw; height: 100vh; border-radius: 0; } .admin-bar .qrt-app { height: calc(100vh - 46px); } .qrt-app .qrt-preloader { border-radius: 0; } .qrt-app .qrt-top-bar { border-radius: 0; padding-right: 20px; } .qrt-app .qrt-top-bar.qrt-top-bar-wsm { padding-left: 20px; } .qrt-app .qrt-top-bar .qrt-symbol { border-radius: 0; } /*.qrt-app .qrt-top-bar .qrt-logo { opacity: 0; pointer-events: none; visibility: hidden; }*/ .qrt-app .qrt-top-bar .qrt-menu { position: absolute; overflow: auto; -webkit-overflow-scrolling: touch; top: 80px; left: 0; height: calc(100vh - 80px); width: 100%; background-color: #28292c; padding: 40px 20px; -webkit-transform: translateZ(-1px) translateY(-100%); transform: translateZ(-1px) translateY(-100%); } .admin-bar .qrt-app .qrt-top-bar .qrt-menu { height: calc(100vh - 126px); } .qrt-app .qrt-top-bar .qrt-menu nav { width: 100%; } .qrt-app .qrt-top-bar .qrt-menu nav ul { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .qrt-app .qrt-top-bar .qrt-menu nav ul li { height: auto; margin: 0 0 20px; } .qrt-app .qrt-top-bar .qrt-menu nav ul li:last-child { margin-bottom: 0; } .qrt-app .qrt-top-bar .qrt-menu nav ul li a { color: white; } .qrt-app .qrt-top-bar .qrt-menu nav ul li ul { border-radius: 5px; min-width: 100%; } .qrt-app .qrt-top-bar .qrt-menu nav ul li ul li { display: -webkit-box; display: -ms-flexbox; display: flex; } .qrt-app .qrt-top-bar .qrt-menu nav ul li ul li a { color: #28292c; } .qrt-app .qrt-top-bar .qrt-menu nav ul li.current-menu-item:after { display: none; } .qrt-app .qrt-top-bar .qrt-menu nav > ul > li.current-menu-item a { color: #ff7043; } .qrt-app .qrt-top-bar .qrt-menu nav ul li.current-menu-item ul li a { color: #28292c; } .qrt-app .qrt-top-bar .qrt-menu.qrt-active { -webkit-transform: translateZ(-1px) translateY(0); transform: translateZ(-1px) translateY(0); } .qrt-app .qrt-top-bar .qrt-menu.qrt-active ul { opacity: 1; } .qrt-app .qrt-top-bar .qrt-buttons .qrt-menu-btn { display: -webkit-box; display: -ms-flexbox; display: flex; } .qrt-app .qrt-top-bar .qrt-info { height: calc(100vh - 80px); width: calc(100vw - 80px); } .admin-bar .qrt-app .qrt-top-bar .qrt-info { height: calc(100vh - 126px); } .qrt-app .qrt-top-bar .qrt-info .qrt-info-frame { padding: 40px 20px; } .qrt-app .qrt-top-bar .qrt-search { width: 100%; left: 0; } .qrt-app .qrt-top-bar .qrt-search.qrt-active { border-radius: 0; } .qrt-app .qrt-content { position: relative; width: 100vw; height: calc(100vh - 80px); } .admin-bar .qrt-app .qrt-content { height: calc(100vh - 126px) } .qrt-app .qrt-content .qrt-content-frame { padding: 20px; min-height: calc(100vh - 80px) } .admin-bar .qrt-app .qrt-content .qrt-content-frame { padding: 20px; min-height: calc(100vh - 126px) } .qrt-app .qrt-content .qrt-half-content-frame .qrt-left { padding: 40px 20px 20px; } .qrt-app .qrt-left-bar { display: none; } .qrt-app .qrt-cursor { display: none; } .qrt-app .qrt-top-bar .qrt-menu nav ul li ul ul { left: 0; top: 0; } } /* ----- frame (after 430px) ----- */ @media (max-width: 430px) { .qrt-app .qrt-top-bar .qrt-info { width: 100vw; } } /* ----- half banner ----- */ .qrt-half-banner { width: 100%; height: 100%; top: 0; position: relative; overflow: hidden; background-color: #28292c; -webkit-box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); } .qrt-half-banner .qrt-image-frame { position: absolute; overflow: hidden; top: 0; left: 0; right: 0; width: 100%; height: 100%; } .qrt-half-banner .qrt-video-background { position: absolute; overflow: hidden; top: 0; left: 0; right: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; } .qrt-half-banner.qrt-animated-zoom .qrt-image-frame { -webkit-animation: zoom 20s linear infinite; animation: zoom 20s linear infinite; } .qrt-half-banner.qrt-animated-show .qrt-image-frame img { -webkit-animation: show 60s linear infinite; animation: show 60s linear infinite; } .qrt-half-banner img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; } .qrt-half-banner .qrt-overlay { position: relative; width: 100%; height: 100%; padding: 40px; background-color: rgba(20, 21, 24, 0.5); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .qrt-half-banner .qrt-overlay .qrt-banner-title { text-align: right; } .qrt-half-banner .qrt-overlay .qrt-banner-title .qrt-divider-2 { margin-left: auto; } .qrt-half-banner.qrt-left-align .qrt-overlay .qrt-scroll-hint { left: 40px; } .qrt-half-banner.qrt-left-align .qrt-banner-title { text-align: left; } .qrt-half-banner.qrt-left-align .qrt-banner-title .qrt-divider-2 { margin-right: auto; margin-left: 0; } .qrt-scroll-hint { position: absolute; top: 40px; right: 40px; } .qrt-scroll-hint span { display: block; position: relative; width: 25px; height: 40px; border-radius: 15px; border: solid 2px #ff7043; } .qrt-scroll-hint span:before { content: 'Scroll Down'; text-transform: uppercase; letter-spacing: 2px; font-size: 11px; width: 100px; text-align: right; position: absolute; bottom: -75px; right: -38px; color: #fff; -webkit-transform: rotate(90deg); transform: rotate(90deg); } .qrt-scroll-hint span:after { content: ''; width: 3px; height: 3px; background-color: #ff7043; border-radius: 50%; position: absolute; top: 10px; left: 45%; -webkit-animation: mouse 1s ease-in-out infinite; animation: mouse 1s ease-in-out infinite; } .qrt-hint-frame { bottom: 0; right: 0; position: absolute; background-color: #28292c; height: 240px; width: 90px; } .qrt-hint-frame.qrt-left { left: 0; right: auto; } .qrt-hint-frame .qrt-scroll-hint { position: absolute; top: 40px; right: 33px; } .qrt-hint-frame .qrt-scroll-hint span { display: block; position: relative; width: 25px; height: 40px; border-radius: 15px; border: solid 2px #ff7043; } /* ----- half banner (after 1200px) ----- */ @media (max-width: 1200px) { .qrt-half-banner .qrt-overlay { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .qrt-half-banner .qrt-overlay .qrt-banner-title { position: relative; width: 100%; text-align: center; } .qrt-half-banner .qrt-overlay .qrt-banner-title .qrt-divider-2 { margin: 0 auto 20px; } } /* ----- half banner (after 768px) ----- */ @media (max-width: 768px) { .qrt-half-banner .qrt-overlay .qrt-scroll-hint { display: none; } } /* ----- main banner ----- */ .qrt-banner { background-color: #28292c; overflow: hidden; width: 100%; position: relative; height: calc(100vh - 100px); } .admin-bar .qrt-banner { height: calc(100vh - 132px); } .qrt-banner .qrt-image-frame { width: 100%; height: 100%; position: absolute; top: 0; left: 0; } .qrt-banner.qrt-animated-zoom .qrt-image-frame { -webkit-animation: zoom 20s linear infinite; animation: zoom 20s linear infinite; } .qrt-banner.qrt-animated-show .qrt-image-frame { -webkit-animation: show 60s linear infinite; animation: show 60s linear infinite; } .qrt-banner img { width: 100%; height: 100% !important; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; } .qrt-banner .qrt-video-background { position: absolute; right: 0; bottom: 0; min-width: 100%; min-height: 100%; width: auto; height: auto; -o-object-fit: cover; object-fit: cover; z-index: 0; } .qrt-banner .qrt-overlay { position: relative; width: 100%; height: 100%; padding: 40px; background-color: rgba(40, 41, 44, 0.6); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .qrt-banner .qrt-overlay .qrt-banner-title { width: 80%; margin: 0 auto; position: relative; } .qrt-banner .qrt-overlay .qrt-banner-title .qrt-text { max-width: 500px; } /* ----- main banner (after 768px) ----- */ @media (max-width: 768px) { .qrt-banner { height: calc(100vh - 80px); } .admin-bar .qrt-banner { height: calc(100vh - 126px); } .qrt-banner .qrt-overlay { padding: 20px; } .qrt-banner .qrt-overlay .qrt-banner-title { text-align: center; margin: 0; width: 100%; } .qrt-banner .qrt-overlay .qrt-banner-title .qrt-divider-2 { margin: 0 auto 20px; } .qrt-banner .qrt-overlay .qrt-banner-title .qrt-text { margin: 0 auto; display: block; } } /* ----- main slider ----- */ .qrt-main-slider, .qrt-main-slider-onepage { position: relative; overflow: hidden; width: 100%; height: calc(100vh - 100px); background-color: #28292c; } .admin-bar .qrt-main-slider, .admin-bar .qrt-main-slider-onepage { height: calc(100vh - 132px); } .qrt-main-slider .qrt-project-cover, .qrt-main-slider-onepage .qrt-project-cover { position: relative; overflow: hidden; height: 100%; width: calc(100vw - 100px); } .qrt-main-slider .qrt-project-cover .qrt-image-frame, .qrt-main-slider-onepage .qrt-project-cover .qrt-image-frame { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .qrt-main-slider .qrt-project-cover .qrt-video-background, .qrt-main-slider-onepage .qrt-project-cover .qrt-video-background { position: absolute; right: 0; bottom: 0; min-width: 100%; min-height: 100%; width: auto; height: auto; -o-object-fit: cover; object-fit: cover; z-index: 0; } .qrt-main-slider .qrt-project-cover img, .qrt-main-slider-onepage .qrt-project-cover img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; z-index: 0; } .qrt-main-slider .qrt-project-cover .qrt-overlay, .qrt-main-slider-onepage .qrt-project-cover .qrt-overlay { position: relative; width: 100%; height: 100%; padding: 40px; background-color: rgba(40, 41, 44, 0.6); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .qrt-main-slider .qrt-project-cover .qrt-overlay .qrt-parallax-fix, .qrt-main-slider-onepage .qrt-project-cover .qrt-overlay .qrt-parallax-fix { position: relative; width: 100%; height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .qrt-main-slider .qrt-project-cover .qrt-overlay .qrt-banner-title, .qrt-main-slider-onepage .qrt-project-cover .qrt-overlay .qrt-banner-title { width: 80%; margin: 0 auto; position: relative; } .qrt-main-slider .qrt-project-cover .qrt-overlay .qrt-banner-title .qrt-text, .qrt-main-slider-onepage .qrt-project-cover .qrt-overlay .qrt-banner-title .qrt-text { max-width: 400px; } .qrt-slider-navigation { width: 350px; display: -webkit-box; display: -ms-flexbox; display: flex; } .qrt-slider-navigation.qrt-absolute { position: absolute; z-index: 999; right: 0; bottom: 0; } .qrt-slider-navigation .qrt-slider-nav-btn { position: relative; overflow: hidden; background-color: #28292c; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 50%; height: 70px; cursor: pointer; text-transform: uppercase; font-size: 11px; letter-spacing: 2px; font-weight: 600; color: #f7f8f8; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-slider-navigation .qrt-slider-nav-btn span { -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; opacity: 1; } .qrt-slider-navigation .qrt-slider-nav-btn:focus { outline: inherit; } .qrt-slider-navigation .qrt-slider-nav-btn:after { color: #f7f8f8; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; content: ''; -webkit-transform: translateY(1px); transform: translateY(1px); } .qrt-slider-navigation .qrt-slider-nav-btn:before { color: #f7f8f8; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; content: ''; -webkit-transform: translateY(1px); transform: translateY(1px); } .qrt-slider-navigation .qrt-slider-nav-btn.qrt-main-prev:hover i { -webkit-transform: translateX(-5px); transform: translateX(-5px); } .qrt-slider-navigation .qrt-slider-nav-btn.qrt-main-prev.swiper-button-disabled { pointer-events: none; } .qrt-slider-navigation .qrt-slider-nav-btn.qrt-main-prev.swiper-button-disabled:after { content: 'first'; margin-right: 10px; opacity: 0.3; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-slider-navigation .qrt-slider-nav-btn.qrt-main-prev.swiper-button-disabled span { opacity: 0; width: 0; } .qrt-slider-navigation .qrt-slider-nav-btn.qrt-main-prev.swiper-button-disabled i { -webkit-transform: translateX(-40px); transform: translateX(-40px); opacity: 0; } .qrt-slider-navigation .qrt-slider-nav-btn.qrt-main-next:hover i { -webkit-transform: translateX(5px); transform: translateX(5px); } .qrt-slider-navigation .qrt-slider-nav-btn.qrt-main-next.swiper-button-disabled { pointer-events: none; } .qrt-slider-navigation .qrt-slider-nav-btn.qrt-main-next.swiper-button-disabled:before { content: 'last'; margin-left: 10px; opacity: 0.3; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-slider-navigation .qrt-slider-nav-btn.qrt-main-next.swiper-button-disabled span { display: none; } .qrt-slider-navigation .qrt-slider-nav-btn.qrt-main-next.swiper-button-disabled i { -webkit-transform: translateX(40px); transform: translateX(40px); opacity: 0; } .qrt-slider-navigation .qrt-slider-nav-btn span { -webkit-transform: translateY(1px); transform: translateY(1px); margin: 0 5px; position: relative; overflow: hidden; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-slider-navigation .qrt-slider-nav-btn i { margin: 0 5px; font-size: 8px; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-slider-pagination { position: absolute; z-index: 9999; width: 100%; bottom: 0; left: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .qrt-slider-pagination .swiper-main-pagination { height: 3px; position: relative; width: 100%; background-color: rgba(255, 255, 255, 0.3); } .qrt-slider-pagination .swiper-main-pagination .swiper-pagination-progressbar-fill { height: 100%; background-color: #ff7043; } /* ----- main slider (after 768px) ----- */ @media (max-width: 768px) { .qrt-main-slider, .qrt-main-slider-onepage { height: calc(100vh - 80px); } .admin-bar .qrt-main-slider, .admin-bar .qrt-main-slider-onepage { height: calc(100vh - 126px); } .qrt-main-slider .qrt-project-cover, .qrt-main-slider-onepage .qrt-project-cover { width: 100vw; } .qrt-main-slider .qrt-project-cover .qrt-overlay, .qrt-main-slider-onepage .qrt-project-cover .qrt-overlay { padding: 20px; } .qrt-main-slider .qrt-project-cover .qrt-overlay .qrt-banner-title, .qrt-main-slider-onepage .qrt-project-cover .qrt-overlay .qrt-banner-title { margin-bottom: 70px; width: 100%; text-align: center; } .qrt-main-slider .qrt-project-cover .qrt-overlay .qrt-banner-title .qrt-divider-2, .qrt-main-slider-onepage .qrt-project-cover .qrt-overlay .qrt-banner-title .qrt-divider-2 { margin: 0 auto 20px; } .qrt-main-slider .qrt-project-cover .qrt-overlay .qrt-banner-title .qrt-text, .qrt-main-slider-onepage .qrt-project-cover .qrt-overlay .qrt-banner-title .qrt-text { margin: 0 auto; display: block; } .qrt-slider-navigation { width: 100%; } } /* ----- animations ----- */ @-webkit-keyframes zoom { 0% { -webkit-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1.1); transform: scale(1.1); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @keyframes zoom { 0% { -webkit-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1.1); transform: scale(1.1); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @-webkit-keyframes show { 0% { object-position: center; } 50% { object-position: left; } 100% { object-position: right; } } @keyframes show { 0% { -o-object-position: center; object-position: center; } 50% { -o-object-position: left; object-position: left; } 100% { -o-object-position: right; object-position: right; } } @-webkit-keyframes mouse { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 50% { -webkit-transform: translateY(5px); transform: translateY(5px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes mouse { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 50% { -webkit-transform: translateY(5px); transform: translateY(5px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } /* ----- menu in animation ----- */ .qrt-app .qrt-top-bar .qrt-menu .qrt-dynamic-menu { pointer-events: all; opacity: 1; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-app .qrt-top-bar .qrt-menu .qrt-dynamic-menu nav ul li.current-menu-item:after { content: ''; width: 135%; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } /* ----- menu out animation ----- */ html.is-animating .qrt-app .qrt-top-bar .qrt-menu .qrt-dynamic-menu { pointer-events: none; opacity: 0.999; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } html.is-animating .qrt-app .qrt-top-bar .qrt-menu .qrt-dynamic-menu nav ul li.current-menu-item:after { content: ''; width: 0; } html.is-animating .qrt-app .qrt-top-bar .qrt-menu .qrt-dynamic-menu nav ul li ul { opacity: 0; -webkit-transform: translateY(10px); transform: translateY(10px); -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } /* ----- content in animation ----- */ .qrt-dynamic-content { pointer-events: all; position: relative; opacity: 1; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-dynamic-content .qrt-banner, .qrt-dynamic-content .qrt-half-banner { -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-dynamic-content .qrt-banner .qrt-video-background, .qrt-dynamic-content .qrt-banner img, .qrt-dynamic-content .qrt-half-banner .qrt-video-background, .qrt-dynamic-content .qrt-half-banner img { -webkit-transform: translateX(0); transform: translateX(0); -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; -webkit-transition-delay: 0.4s; transition-delay: 0.4s; } .qrt-dynamic-content .qrt-banner .qrt-overlay .qrt-scroll-hint, .qrt-dynamic-content .qrt-half-banner .qrt-overlay .qrt-scroll-hint { opacity: 1; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; -webkit-transition-delay: 0.8s; transition-delay: 0.8s; } .qrt-dynamic-content .qrt-banner .qrt-overlay .qrt-banner-title, .qrt-dynamic-content .qrt-half-banner .qrt-overlay .qrt-banner-title { opacity: 1; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; -webkit-transition-delay: 0.8s; transition-delay: 0.8s; } .qrt-dynamic-content .qrt-slider-navigation { -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; -webkit-transition-delay: 0.8s; transition-delay: 0.8s; } .qrt-dynamic-content .qrt-main-slider, .qrt-dynamic-content .qrt-main-slider-onepage { -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-dynamic-content .qrt-main-slider .qrt-project-cover .video-background, .qrt-dynamic-content .qrt-main-slider-onepage .qrt-project-cover .video-background { -webkit-transform: translateX(0); transform: translateX(0); -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; -webkit-transition-delay: 0.4s; transition-delay: 0.4s; } .qrt-dynamic-content .qrt-main-slider .qrt-project-cover .qrt-image-frame, .qrt-dynamic-content .qrt-main-slider-onepage .qrt-project-cover .qrt-image-frame { -webkit-transform: translateX(0); transform: translateX(0); -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; -webkit-transition-delay: 0.4s; transition-delay: 0.4s; } .qrt-dynamic-content .qrt-main-slider .qrt-project-cover .qrt-overlay .qrt-banner-title, .qrt-dynamic-content .qrt-main-slider-onepage .qrt-project-cover .qrt-overlay .qrt-banner-title { opacity: 1; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; -webkit-transition-delay: 0.8s; transition-delay: 0.8s; } .qrt-dynamic-content .qrt-map-frame { -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-dynamic-content .qrt-map-frame .qrt-map { opacity: 1; -webkit-transform: scale(1); transform: scale(1); -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; -webkit-transition-delay: 0.4s; transition-delay: 0.4s; } .qrt-dynamic-content .qrt-about-me-cover, .qrt-dynamic-content .qrt-page-cover { width: 100%; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-dynamic-content .qrt-about-me-cover img, .qrt-dynamic-content .qrt-page-cover img { opacity: 1; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; -webkit-transition-delay: 0.4s; transition-delay: 0.4s; } .qrt-dynamic-content .qrt-about-me-cover .qrt-about-info, .qrt-dynamic-content .qrt-about-me-cover .qrt-hint-frame, .qrt-dynamic-content .qrt-page-cover .qrt-about-info, .qrt-dynamic-content .qrt-page-cover .qrt-hint-frame { -webkit-transform: translateY(0); transform: translateY(0); -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; -webkit-transition-delay: 0.6s; transition-delay: 0.6s; } .qrt-app .qrt-left-bar .qrt-current-page-title { padding-right: 40px; opacity: 1; letter-spacing: 2px; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } /* ----- content out animation ----- */ html.is-animating .qrt-dynamic-content { opacity: 0; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; -webkit-transition-delay: 1s; transition-delay: 1s; } html.is-animating .qrt-dynamic-content .qrt-banner, html.is-animating .qrt-dynamic-content .qrt-half-banner { -webkit-transform: translateY(-100%); transform: translateY(-100%); -webkit-transition-delay: 0.8s; transition-delay: 0.8s; } html.is-animating .qrt-dynamic-content .qrt-banner .qrt-video-background, html.is-animating .qrt-dynamic-content .qrt-banner img, html.is-animating .qrt-dynamic-content .qrt-half-banner .qrt-video-background, html.is-animating .qrt-dynamic-content .qrt-half-banner img { -webkit-transform: translateX(-100%); transform: translateX(-100%); -webkit-transition-delay: 0.4s; transition-delay: 0.4s; } html.is-animating .qrt-dynamic-content .qrt-banner .qrt-overlay .qrt-scroll-hint, html.is-animating .qrt-dynamic-content .qrt-half-banner .qrt-overlay .qrt-scroll-hint { opacity: 0; -webkit-transition-delay: 0s; transition-delay: 0s; } html.is-animating .qrt-dynamic-content .qrt-banner .qrt-overlay .qrt-banner-title, html.is-animating .qrt-dynamic-content .qrt-half-banner .qrt-overlay .qrt-banner-title { opacity: 0; -webkit-transition-delay: 0s; transition-delay: 0s; } html.is-animating .qrt-dynamic-content .qrt-slider-navigation { -webkit-transform: translateY(100%); transform: translateY(100%); -webkit-transition-delay: 0s; transition-delay: 0s; } html.is-animating .qrt-dynamic-content .qrt-main-slider, html.is-animating .qrt-dynamic-content .qrt-main-slider-onepage { -webkit-transform: translateY(-100%); transform: translateY(-100%); -webkit-transition-delay: 0.8s; transition-delay: 0.8s; } html.is-animating .qrt-dynamic-content .qrt-main-slider .qrt-project-cover .video-background, html.is-animating .qrt-dynamic-content .qrt-main-slider-onepage .qrt-project-cover .video-background { -webkit-transform: translateX(-100%); transform: translateX(-100%); -webkit-transition-delay: 0.4s; transition-delay: 0.4s; } html.is-animating .qrt-dynamic-content .qrt-main-slider .qrt-project-cover .qrt-image-frame, html.is-animating .qrt-dynamic-content .qrt-main-slider-onepage .qrt-project-cover .qrt-image-frame { -webkit-transform: translateX(-100%); transform: translateX(-100%); -webkit-transition-delay: 0.4s; transition-delay: 0.4s; } html.is-animating .qrt-dynamic-content .qrt-main-slider .qrt-project-cover .qrt-overlay .qrt-banner-title, html.is-animating .qrt-dynamic-content .qrt-main-slider-onepage .qrt-project-cover .qrt-overlay .qrt-banner-title { opacity: 0; -webkit-transition-delay: 0s; transition-delay: 0s; } html.is-animating .qrt-dynamic-content .qrt-map-frame { -webkit-transform: translateY(-100%); transform: translateY(-100%); -webkit-transition-delay: 0.8s; transition-delay: 0.8s; } html.is-animating .qrt-dynamic-content .qrt-map-frame .qrt-map { opacity: 0; -webkit-transform: scale(0.5); transform: scale(0.5); -webkit-transition-delay: 0s; transition-delay: 0s; } html.is-animating .qrt-dynamic-content .qrt-about-me-cover, html.is-animating .qrt-dynamic-content .qrt-page-cover { width: 0; -webkit-transition-delay: 0.8s; transition-delay: 0.8s; } html.is-animating .qrt-dynamic-content .qrt-about-me-cover img, html.is-animating .qrt-dynamic-content .qrt-page-cover img { opacity: 0; } html.is-animating .qrt-dynamic-content .qrt-about-me-cover .qrt-about-info, html.is-animating .qrt-dynamic-content .qrt-about-me-cover .qrt-hint-frame, html.is-animating .qrt-dynamic-content .qrt-page-cover .qrt-about-info, html.is-animating .qrt-dynamic-content .qrt-page-cover .qrt-hint-frame { -webkit-transform: translateY(100%); transform: translateY(100%); -webkit-transition-delay: 0s; transition-delay: 0s; } html.is-animating .qrt-app .qrt-left-bar .qrt-current-page-title { padding-right: 50px; opacity: 0; letter-spacing: 6px; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; -webkit-transition-delay: 0.4s; transition-delay: 0.4s; } /* ------------------------------ content ------------------------------ */ /* ----- cover ----- */ .qrt-page-cover { overflow: hidden; background-color: #dee1e6; position: relative; padding-bottom: 50%; } .qrt-page-cover img { position: absolute; top: 0; left: 0; -o-object-fit: cover; object-fit: cover; -o-object-position: bottom; object-position: bottom; width: 100%; height: 100% !important; } .qrt-page-cover.qrt-cover-center img { -o-object-position: center; object-position: center; } .qrt-page-cover .qrt-about-info { padding: 20px; width: 300px; background-color: #28292c; position: absolute; left: 0; bottom: 0; } .qrt-page-cover .qrt-about-info.qrt-info-lg { width: 450px; left: auto; right: 0; } .qrt-page-cover .qrt-about-info.qrt-right-position { right: 0; left: auto; } .qrt-page-cover .qrt-about-info .qrt-table li>span { -webkit-transform: translateY(-1px); transform: translateY(-1px); color: white; opacity: 0.6; } .qrt-about-me-cover { overflow: hidden; position: relative; background-color: #dee1e6; padding-bottom: 105%; margin-bottom: 40px; } .qrt-about-me-cover img { width: 100%; height: 100% !important; position: absolute; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; top: 0; left: 0; } .qrt-member-about { margin-bottom: 40px; } @media (max-width: 768px) { .qrt-page-cover { padding-bottom: 100%; } .qrt-page-cover img { height: calc(100% - 80px) !important; } .qrt-page-cover .qrt-hint-frame { display: none; } .qrt-page-cover .qrt-about-info, .qrt-page-cover .qrt-about-info.qrt-info-lg { width: 100%; } .qrt-member-about .qrt-hint-frame { display: none; } } /* ----- counter up ----- */ .qrt-counter-frame { margin-bottom: 40px; } .qrt-counter-frame .qrt-counter-box .qrt-counter { display: inline-block; vertical-align: middle; font-size: 22px; font-weight: 800; margin-bottom: 10px; color: #28292c; } .qrt-counter-frame .qrt-counter-box .qrt-counter-plus { display: inline-block; vertical-align: super; } /* ----- team ----- */ .qrt-team-member { position: relative; overflow: hidden; margin-bottom: 40px; } .qrt-team-member .qrt-team-item { width: 100%; display: block; position: relative; padding-bottom: 105%; -webkit-filter: brightness(95%); filter: brightness(95%); -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-team-member .qrt-team-item img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; } .qrt-team-member .qrt-team-item:hover { -webkit-filter: brightness(105%); filter: brightness(105%); } .qrt-team-member .qrt-team-member-description { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background-color: #28292c; padding: 15px 20px; } .qrt-team-member .qrt-team-member-description h4 { margin-bottom: 5px; } .qrt-team-member .qrt-team-member-description .qrt-member-more { background-color: #ff7043; width: 35px; height: 35px; border-radius: 50%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #28292c; } /* ----- prices ----- */ .qrt-price { overflow: hidden; position: relative; background-size: cover; background: white; text-align: center; -webkit-box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); margin-bottom: 40px; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-price.qrt-popular-price { -webkit-transform: scale(1.03); transform: scale(1.03); } .qrt-price.qrt-popular-price:before { font-size: 9px; position: absolute; -webkit-transform: rotate(45deg); transform: rotate(45deg); z-index: 99; top: 15px; font-weight: 600; color: #28292c; right: -78px; content: 'POPULAR'; padding: 2px 0 1px; width: 200px; text-align: center; background: #ff7043; } .qrt-price .qrt-price-body { position: relative; padding: 20px; } .qrt-price .qrt-price-body .qrt-asterisk { position: absolute; width: 100%; bottom: 3px; left: 0; text-align: center; font-size: 10px; opacity: 0.4; } .qrt-price .qrt-price-body .qrt-price-cost { position: relative; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-bottom: 20px; padding: 0 10px; } .qrt-price .qrt-price-body .qrt-price-cost .qrt-number { font-size: 36px; color: #28292c; font-weight: 800; margin-bottom: 0; } .qrt-price .qrt-price-body .qrt-price-cost .qrt-number .qrt-number-span { color: #28292c; font-size: 12px; padding: 0 5px; opacity: 0.6; } .qrt-price .qrt-price-body .qrt-price-cost .qrt-number sup { font-size: 18px; position: absolute; top: 10px; right: 0; } .qrt-price .qrt-price-body .qrt-price-list ul { padding: 0; margin: 0 0 30px; } .qrt-price .qrt-price-body .qrt-price-list ul li { list-style-type: none; margin-bottom: 15px; } .qrt-price .qrt-price-body .qrt-price-list ul li:before { font-family: "FontAwesome"; font-weight: 900; content: "\f00c"; margin-right: 5px; font-size: 9px; color: #ff7043; } .qrt-price .qrt-price-body .qrt-price-list ul li del { opacity: 0.3; } .qrt-price .qrt-price-body .qrt-price-list ul li.qrt-empty-item:before { font-family: "FontAwesome"; font-weight: 900; content: "\f00d"; margin-right: 5px; font-size: 9px; color: #ff7043; opacity: 0.3; } /* ----- timeline ----- */ .qrt-timeline { position: relative; } .qrt-timeline::before { content: ''; position: absolute; top: 5px; left: 0; height: calc(100% - 5px); width: 1px; background: #dee1e6; } .qrt-timeline .qrt-timeline-item { position: relative; } .qrt-timeline .qrt-timeline-item .qrt-timeline-mark { position: absolute; top: 6px; left: -6px; width: 12px; height: 12px; border-radius: 50%; border: solid 3px #ff7043; background: white; } .qrt-timeline .qrt-timeline-item:hover .qrt-timeline-mark-light { -webkit-animation: puls 1s infinite; animation: puls 1s infinite; } .qrt-timeline .qrt-timeline-item .qrt-timeline-content { position: relative; margin-left: 30px; margin-bottom: 40px; } .qrt-timeline .qrt-timeline-item .qrt-timeline-content .qrt-card-header { width: 100%; } .qrt-timeline .qrt-timeline-item .qrt-timeline-content .qrt-card-header .qrt-date { border-radius: 2px; position: relative; display: inline-block; color: #dee1e6; margin-left: auto; background: #28292c; padding: 4px 15px; font-size: 11px; } .qrt-timeline .qrt-timeline-item .qrt-timeline-content .qrt-card-header .qrt-date::before { content: ''; position: absolute; top: 7px; left: -4px; height: 8px; width: 8px; background: #28292c; -webkit-transform: rotate(45deg); transform: rotate(45deg); } .qrt-timeline .qrt-timeline-item .qrt-timeline-content .qrt-card-header .qrt-el-suptitle { font-style: italic; font-size: 12px; margin-bottom: 20px; } .qrt-timeline .qrt-timeline-item:last-child .qrt-timeline-content { margin-bottom: 0; } /* ----- testimonials ----- */ .qrt-testimonial { position: relative; margin-bottom: 20px; } .qrt-testimonial:after { position: absolute; font-family: "FontAwesome"; font-weight: 900; content: "\f10d"; font-size: 16px; opacity: 0.6; color: #eee; top: 15px; right: 20px; -webkit-transform: rotate(180deg); transform: rotate(180deg); } .qrt-testimonial .qrt-testimonial-header { display: -webkit-box; display: -ms-flexbox; display: flex; margin-bottom: 20px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .qrt-testimonial .qrt-testimonial-header img { width: 60px; height: 60px; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; border-radius: 50%; } .qrt-testimonial .qrt-testimonial-header .qrt-testimonial-name { padding-left: 15px; } .qrt-testimonial .qrt-stars { background-color: #28292c; border-radius: 10px; padding: 0; margin: 0; padding: 3px 10px; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; margin-top: 20px; } .qrt-testimonial .qrt-stars li { padding: 0 2px; list-style-type: none; } .qrt-testimonial .qrt-stars li i { font-size: 11px; color: #ff7043; } .qrt-testimonial .qrt-stars li.qrt-empty i { color: white; opacity: 0.3; } /* ----- brands ----- */ .qrt-brands-slider { margin-bottom: 40px; pointer-events: none; } .qrt-brands-slider .swiper-slide img { width: 90px; margin-left: auto; margin-right: auto; } /* ----- call to action ----- */ .qrt-call-to-action { padding: 20px 40px; background-color: #28292c; display: -webkit-box; display: -ms-flexbox; display: flex; height: 80px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .qrt-call-to-action h4 { color: white; margin-right: 80px; } .qrt-call-to-action.qrt-call-to-action-white { background-color: white; } .qrt-call-to-action.qrt-call-to-action-white h4 { color: #28292c; } @media (max-width: 768px) { .qrt-call-to-action { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; height: auto; padding: 40px; } .qrt-call-to-action h4 { margin-right: 0; margin-bottom: 40px; font-size: 22px; } .qrt-call-to-action.qrt-call-to-action-white { background-color: white; } .qrt-call-to-action.qrt-call-to-action-white h4 { color: #28292c; } } /* ----- icon box ----- */ .qrt-icon-box { margin-bottom: 40px; } .qrt-icon-box img { width: 50px; margin-bottom: 20px; } .qrt-icon-box h4 { margin-bottom: 20px; } /* ----- contact ----- */ .qrt-form-field input, .qrt-form-field textarea { height: 50px; width: 100%; background: white; border: none; color: #28292c; font-size: 14px; padding-left: 45px !important; padding-right: 15px; -webkit-box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); margin-bottom: 0; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } ::-webkit-input-placeholder { font-size: 14px; color: #28292c; } :-ms-input-placeholder { font-size: 14px; color: #28292c; } ::-ms-input-placeholder { font-size: 14px; color: #28292c; } ::placeholder { font-size: 14px; color: #28292c; } .qrt-form-field textarea { padding-left: 15px !important; padding-top: 15px; height: 150px; border-left: solid 30px white; } .qrt-form-field textarea.qrt-active { border-color: #ff7043; } .qrt-form-field textarea:focus { border-color: #ff7043; } .qrt-contact-form .qrt-input:focus { outline: none; } .qrt-contact-form .qrt-input.qrt-active+label, .qrt-contact-form .qrt-input:focus+label { background: #ff7043; color: #28292c; } .qrt-form-field { position: relative; margin-bottom: 20px; } .qrt-contact-form label { text-align: center; color: #28292c; position: absolute; height: 50px; width: 45px; background: white; top: 0; left: 0; padding: 0 15px; text-transform: uppercase; font-size: 13px; line-height: 53px; letter-spacing: 1px; font-weight: 500; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; cursor: text; } .qrt-submit-frame { position: relative; height: 45px; } /* ----- blog card ----- */ .qrt-post-date { background-color: #28292c; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; padding: 10px 10px 8px; color: white; font-size: 11px; } .qrt-post-date span { margin-right: 10px; } .qrt-post-date span i { margin-right: 7px; } .qrt-post-frame { overflow: hidden; position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 40px; } .qrt-post-frame.qrt-popular:before { font-size: 11px; position: absolute; z-index: 9; -webkit-transform: rotate(45deg); transform: rotate(45deg); z-index: 99; top: 15px; font-weight: 600; color: #28292c; right: -78px; content: 'POPULAR'; padding: 2px; width: 200px; text-align: center; background: #ff7043; } .qrt-post-frame .qrt-post-thumb { background-color: #28292c; margin-bottom: 15px; width: 100%; padding-bottom: 60%; position: relative; -webkit-filter: brightness(90%); filter: brightness(90%); -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-post-frame .qrt-post-thumb.qrt-post-thumb-empty { padding-bottom: 23px; background: transparent; } .qrt-post-frame .qrt-post-thumb img { width: 100%; height: 100%; position: absolute; top: 0; left: 0; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; } .qrt-post-frame .qrt-post-thumb:hover { -webkit-filter: brightness(110%); filter: brightness(110%); } .qrt-post-frame .qrt-post-thumb .qrt-post-date { background-color: #f7f8f8; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; padding: 5px 0 5px 10px; color: #28292c; font-size: 9px; position: absolute; top: 0; left: 0; } .qrt-post-frame .qrt-post-thumb .qrt-post-date span { margin-right: 10px; } .qrt-post-frame .qrt-post-thumb .qrt-post-date span i { margin-right: 7px; } .qrt-post-frame .qrt-post-descr { width: 100%; padding-left: 0; } .qrt-post-frame .qrt-post-descr .qrt-post-title { margin-bottom: 10px; text-transform: none; overflow: hidden; text-overflow: ellipsis; display: -moz-box; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-clamp: 2; box-orient: vertical; } .qrt-post-frame .qrt-post-descr .qrt-port-short-text { overflow: hidden; text-overflow: ellipsis; display: -moz-box; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-clamp: 2; box-orient: vertical; } .qrt-post-frame .qrt-post-descr a { color: #28292c; } .qrt-post-frame .qrt-post-descr a:hover { color: #28292c; } .qrt-post-frame.qrt-sm-post { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; margin-bottom: 10px; } .qrt-post-frame.qrt-sm-post .qrt-post-thumb { margin-bottom: 0; width: 40%; padding-bottom: 27%; } .qrt-post-frame.qrt-sm-post .qrt-post-descr { width: 60%; padding-left: 10px; } .qrt-post-frame.qrt-sm-post .qrt-post-descr .qrt-post-title { font-size: 14px; margin-bottom: 5px; text-overflow: ellipsis; display: -moz-box; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; line-clamp: 1; box-orient: vertical; } .qrt-post-frame.qrt-sm-post .qrt-post-descr .qrt-port-short-text { overflow: hidden; text-overflow: ellipsis; display: -moz-box; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-clamp: 2; box-orient: vertical; } .qrt-post-frame.qrt-lg-post .qrt-post-thumb { margin-bottom: 0; padding-bottom: 50%; } .qrt-post-frame.qrt-lg-post .qrt-post-descr { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background-color: #28292c; padding: 20px 30px; } .qrt-post-frame.qrt-lg-post .qrt-post-descr .qrt-post-title { font-size: 20px; margin-bottom: 10px; text-transform: none; } .qrt-post-frame.qrt-lg-post .qrt-post-descr .qrt-post-title a { color: white; } .qrt-post-frame.qrt-lg-post .qrt-post-descr .qrt-port-short-text { max-width: 500px; -webkit-line-clamp: 1; line-clamp: 1; } .qrt-post-frame.qrt-lg-post .qrt-post-descr .qrt-work-more { margin-left: 40px; background-color: #ff7043; width: 35px; min-width: 35px; height: 35px; border-radius: 50%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #28292c; } .qrt-blog-pagination, .page-links { margin-top: 20px; padding: 0; display: flex; text-transform: uppercase; font-size: 11px; letter-spacing: 2px; font-weight: 800; line-height: 55px; } .qrt-blog-pagination a, .qrt-blog-pagination span, .page-links a, .page-links span { height: 45px; line-height: 32px; min-width: 45px; text-align: center; border: none; color: #28292c; background: white; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; position: relative; display: block; padding: .5rem .75rem; margin-left: -1px; border-left: 1px solid #eee; } .qrt-blog-pagination a:hover, .page-links a:hover { background: white; color: #28292c; } .qrt-blog-pagination span.current, .page-links span.current { color: #28292c; background: #ff7043; } .qrt-blog-pagination a:hover, .page-links a:hover { background: #ff7043; } /* ----- table ----- */ .qrt-table { color: #28292c; padding: 0; margin: 0; } .qrt-table li { list-style-type: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 10px; } .qrt-table li:last-child { margin-bottom: 0; } .qrt-table li span { -webkit-transform: translateY(-1px); transform: translateY(-1px); color: #52555a; } .qrt-table li a { color: #52555a; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-table li a:hover { color: #28292c; } /* ----- instagram ----- */ .qrt-instagram .qrt-instagram-frame { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 0 -5px; position: relative; overflow: hidden; } .qrt-instagram .qrt-instagram-frame .qrt-instagram-item { position: relative; width: 33.333333%; padding: 0 5px; margin-bottom: 10px; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-instagram .qrt-instagram-frame .qrt-instagram-item .qrt-instagram-image-frame { position: relative; padding-bottom: 100%; -webkit-filter: brightness(90%); filter: brightness(90%); -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-instagram .qrt-instagram-frame .qrt-instagram-item .qrt-instagram-image-frame img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; } .qrt-instagram .qrt-instagram-frame .qrt-instagram-item .qrt-instagram-image-frame:hover { -webkit-filter: brightness(120%); filter: brightness(120%); } /* ----- social links ----- */ .qrt-social-list { padding: 0; margin: 0; display: -webkit-box; display: -ms-flexbox; display: flex; } .qrt-social-list li { list-style-type: none; margin-right: 10px; } .qrt-social-list li:last-child { margin-right: 0; } .qrt-social-list li a { border-radius: 50%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #28292c; font-size: 12px; height: 35px; width: 35px; border: solid 1px #28292c; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-social-list li a i { line-height: 35px; } .qrt-social-list li a:hover { -webkit-transform: scale(0.9); transform: scale(0.9); } .qrt-social-list li a.qrt-white { color: white; border-color: white; } /* ----- subscribe ----- */ .qrt-subscribe form { display: -webkit-box; display: -ms-flexbox; display: flex; } .qrt-subscribe form input { position: relative; padding-top: 2px; width: 80%; height: 40px; border-radius: 5px 0 0 5px; border: solid 1px #28292c; border-right: none; padding-left: 15px; font-family: "Josefin Sans", sans-serif; } .qrt-subscribe form input::-webkit-input-placeholder { font-family: "Josefin Sans", sans-serif; } .qrt-subscribe form input:-ms-input-placeholder { font-family: "Josefin Sans", sans-serif; } .qrt-subscribe form input::-ms-input-placeholder { font-family: "Josefin Sans", sans-serif; } .qrt-subscribe form input::placeholder { font-family: "Josefin Sans", sans-serif; } .qrt-subscribe form input:focus { outline: inherit; } .qrt-subscribe form button { width: 20%; border-radius: 0 5px 5px 0; } .qrt-subscribe form button:hover i { -webkit-transform: none; transform: none; } /* ----- copyright ----- */ .qrt-copy { font-size: 12px; } .qrt-copy a { -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; } .qrt-copy a:hover { color: #28292c; } /* ------------------------------ portfolio ------------------------------ */ /* ----- portfolio item ----- */ .qrt-work-item { width: 100%; background-color: #28292c; position: relative; overflow: hidden; } .qrt-work-item .qrt-work-descr { -webkit-transform: translateY(100%); transform: translateY(100%); background-color: #28292c; position: absolute; bottom: 0; left: 0; width: 100%; padding: 15px 20px; z-index: 9; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-work-item .qrt-work-descr .qrt-work-more { background-color: #ff7043; width: 35px; min-width: 35px; height: 35px; border-radius: 50%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #28292c; } .qrt-work-item .qrt-work-cover-frame { display: block; position: relative; padding-bottom: 63%; -webkit-filter: brightness(90%); filter: brightness(90%); -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-work-item .qrt-work-cover-frame img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; } .qrt-work-item .qrt-work-cover-frame .qrt-item-zoom { -webkit-transform: translateY(-100%); transform: translateY(-100%); width: 50px; height: 50px; position: absolute; top: 0; right: 0; background: #28292c; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-transition: 0.4s ease-in-out 0.05s; transition: 0.4s ease-in-out 0.05s; } .qrt-work-item .qrt-work-cover-frame .qrt-item-zoom i { text-align: center; width: 60px; font-size: 12px; color: white; line-height: 60px; -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; } .qrt-work-item .qrt-work-cover-frame .qrt-item-zoom:hover { background-color: #28292c; } .qrt-work-item .qrt-work-cover-frame .qrt-item-zoom:hover i { -webkit-transform: scale(1.1); transform: scale(1.1); } .qrt-work-item .qrt-work-cover-frame .qrt-work-category { background-color: #f7f8f8; font-weight: 600; text-transform: uppercase; letter-spacing: 1px; padding: 5px 0 5px 10px; color: #28292c; position: absolute; top: 0; left: 0; font-size: 9px; display: inline-block; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-work-item .qrt-work-cover-frame .qrt-work-category span { margin-right: 10px; } .qrt-work-item .qrt-work-cover-frame:hover { -webkit-filter: brightness(110%); filter: brightness(110%); } .qrt-work-item .qrt-work-cover-frame:hover .qrt-item-zoom { opacity: 1; } .qrt-work-item:hover .qrt-work-descr { -webkit-transform: translateY(0); transform: translateY(0); } .qrt-work-item:hover .qrt-item-zoom { -webkit-transform: translateY(0); transform: translateY(0); } .qrt-work-item.qrt-work-open .qrt-work-descr { -webkit-transform: translateY(0); transform: translateY(0); position: relative; } /* ----- portfolio item (after 768px) ----- */ @media (max-width: 768px) { .qrt-work-item .qrt-work-descr { -webkit-transform: none; transform: none; } } /* ----- portfolio grid sizes ----- */ .qrt-grid-masonry .qrt-masonry-grid-item-h-x-2 .qrt-work-item .qrt-work-cover-frame { padding-bottom: calc(126% + 20px); } .qrt-masonry-grid-item-50 .qrt-work-item .qrt-work-cover-frame { padding-bottom: calc(63% + 8px); } .qrt-grid-masonry .qrt-masonry-grid-item-50.qrt-masonry-grid-item-h-x-2 .qrt-work-item .qrt-work-cover-frame { padding-bottom: calc(126% + 36px); } .qrt-grid-4-col.qrt-grid-masonry .qrt-masonry-grid-item-50 .qrt-work-item .qrt-work-cover-frame { padding-bottom: 63%; } .qrt-grid-4-col.qrt-grid-masonry .qrt-masonry-grid-item-50.qrt-masonry-grid-item-h-x-2 .qrt-work-item .qrt-work-cover-frame { padding-bottom: calc(126% + 20px); } .qrt-grid-4-col.qrt-grid-masonry .qrt-masonry-grid-item-100 .qrt-work-item .qrt-work-cover-frame { padding-bottom: calc(63% + 8px); } /* ----- masonry grid ----- */ .qrt-masonry-grid { margin: -10px; min-height: 100vh !important; } .admin-bar .qrt-masonry-grid { min-height: calc(100vh - 32px) !important; } .qrt-masonry-grid.qrt-masonry-grid-single { min-height: 0px !important; } .qrt-masonry-grid:after { content: ''; display: block; clear: both; } .qrt-grid-sizer, .qrt-masonry-grid-item { width: 25%; } .qrt-masonry-grid-item { float: left; padding: 10px; overflow: hidden; } .qrt-masonry-grid-item-33 { width: 33.333%; } .qrt-masonry-grid-item-50 { width: 50%; } .qrt-grid-masonry .qrt-masonry-grid-item-100 { width: 100%; } .qrt-grid-1-col .qrt-masonry-grid-item-50 { width: 100%; } .qrt-grid-2-col .qrt-masonry-grid-item-50 { width: 50%; } .qrt-grid-3-col .qrt-masonry-grid-item-50, .qrt-grid-3-col .qrt-grid-sizer { width: 33.333%; } .qrt-grid-4-col .qrt-masonry-grid-item-50, .qrt-grid-4-col .qrt-grid-sizer { width: 25%; } .qrt-grid-2-col.qrt-grid-masonry .qrt-masonry-grid-item-100 { width: 100%; } .qrt-grid-3-col.qrt-grid-masonry .qrt-masonry-grid-item-100 { width: 100%; } .qrt-grid-4-col.qrt-grid-masonry .qrt-masonry-grid-item-100 { width: 50%; } /* ----- filter ----- */ .qrt-filter-frame { padding: 20px; } .qrt-filter { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .qrt-filter.qrt-justify-end { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .qrt-filter .qrt-work-category { position: relative; text-transform: uppercase; font-weight: 700; font-size: 11px; display: block; letter-spacing: 1px; background-color: white; color: #28292c; height: 40px; margin-right: 10px; letter-spacing: 2px; line-height: 40px; padding: 2px 20px 0; margin-bottom: 0; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-filter .qrt-work-category.qrt-filter-icon { padding-left: 60px; } .qrt-filter .qrt-work-category.qrt-filter-icon i { text-align: center; line-height: 40px; position: absolute; top: 0; left: 0; background-color: #ff7043; margin-right: 0; height: 100%; width: 40px; } .qrt-filter .qrt-work-category.qrt-current { color: white; background-color: #28292c; } .qrt-filter .qrt-work-category.qrt-current.qrt-filter-icon i { color: #28292c; } @media (max-width: 992px) { .qrt-grid-sizer, .qrt-masonry-grid-item { width: 50% !important; } .qrt-masonry-grid-item-33 { width: 50% !important; } .qrt-masonry-grid-item-50 { width: 50% !important; } .qrt-masonry-grid-item-100 { width: 100% !important; } .qrt-filter { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .qrt-filter .qrt-work-category { margin-bottom: 10px; } .qrt-filter .qrt-work-category:last-child { margin-bottom: 0; } } @media (max-width: 500px) { .qrt-grid-sizer, .qrt-masonry-grid-item { width: 100% !important; } .qrt-masonry-grid-item-33 { width: 100% !important; } .qrt-masonry-grid-item-50 { width: 100% !important; } .qrt-masonry-grid-item-100 { width: 100% !important; } } /* ------------------------------ plugins customization ------------------------------ */ /* ----- smooth scrollbar ----- */ .scrollbar-track { width: 3px !important; background-color: rgba(255, 255, 255, 0); } .scrollbar-track .scrollbar-thumb { width: 3px; background-color: #28292c; opacity: 0.3; margin-bottom: 50px !important; } /* ----- swiper ----- */ .qrt-latest-works-slider .swiper-slide, .qrt-pop-post-slider .swiper-slide, .qrt-testimonials-slider .swiper-slide { pointer-events: none; opacity: 0; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-latest-works-slider .swiper-slide.swiper-slide-active, .qrt-pop-post-slider .swiper-slide.swiper-slide-active, .qrt-testimonials-slider .swiper-slide.swiper-slide-active { opacity: 1; pointer-events: all; } .qrt-latest-works-slider .swiper-slide.swiper-slide-next, .qrt-pop-post-slider .swiper-slide.swiper-slide-next, .qrt-testimonials-slider .swiper-slide.swiper-slide-next { opacity: 1; pointer-events: all; } .qrt-slider-navigation { z-index: 999; } .qrt-brands-slider .swiper-wrapper { -webkit-transition-timing-function: linear; transition-timing-function: linear; } .qrt-slider-nav { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .qrt-slider-nav .qrt-slider-next, .qrt-slider-nav .qrt-slider-prev { margin-left: 20px; font-size: 12px; cursor: pointer; color: #28292c; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-slider-nav .qrt-slider-next.swiper-button-disabled, .qrt-slider-nav .qrt-slider-prev.swiper-button-disabled { color: #28292c; opacity: .3; cursor: not-allowed; } .qrt-slider-nav .qrt-slider-next:focus, .qrt-slider-nav .qrt-slider-prev:focus { outline: inherit; } .swiper-pagination-bullets span.swiper-pagination-bullet { margin-right: 4px; background-color: #28292c; opacity: .3; border-radius: 50%; height: 6px; width: 6px; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .swiper-pagination-bullets span.swiper-pagination-bullet:focus { outline: inherit; } .swiper-pagination-bullets span.swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #28292c; opacity: 1; -webkit-transform: scale(1.3); transform: scale(1.3); } .qrt-rec-popup { background-color: transparent; max-width: 50%; margin-left: auto; margin-right: auto; padding: 40px; } .qrt-rec-popup .qrt-testimonial { border-radius: 2px; background-color: white; padding: 40px; } .qrt-rec-popup .fancybox-button { background-color: transparent; color: #fff; } @media (max-width: 768px) { .fancybox-container { margin: 0; width: 100%; height: 100%; } .fancybox-toolbar { width: 100%; } .fancybox-navigation .fancybox-button { bottom: -10px; top: auto; } .qrt-rec-popup { max-width: 100%; } } /* ----- mapbox ----- */ .qrt-map-frame { background-color: #28292c; position: relative; overflow: hidden; height: 100%; width: 100%; } .qrt-map-frame .qrt-lock { opacity: 0; position: absolute; top: 20px; left: 20px; width: 35px; height: 35px; color: #28292c; background-color: rgba(255, 255, 255, 0.4); z-index: 999; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; cursor: pointer; border-radius: 50%; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } .qrt-map-frame .qrt-lock.qrt-active { opacity: 1; background-color: #ff7043; } .qrt-map-frame .qrt-lock i { font-size: 12px; } .qrt-map-frame:hover .qrt-lock { opacity: 1; } .qrt-map-frame .qrt-map { margin-top: -20%; height: 120%; width: 100%; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; pointer-events: none; } .qrt-map-frame .qrt-map.qrt-active { pointer-events: all; } .qrt-map-frame.qrt-map-frame-2 { height: 400px; width: 100%; } .qrt-map-frame.qrt-map-frame-2 .qrt-map { margin-top: -3%; height: 120%; width: 100%; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } @media (max-width: 1200px) { .qrt-map-frame { background-color: #28292c; } .qrt-map-frame .qrt-map { margin-top: 0; height: 110%; } } .mapboxgl-marker:after { position: absolute; content: ''; -webkit-transform: translateX(-30%) translateY(10px); transform: translateX(-30%) translateY(10px); display: block; color: white; font-weight: 800; text-transform: uppercase; font-size: 10px; padding: 1px 10px; white-space: nowrap; text-align: center; background-color: rgba(255, 255, 255, 0.2); border-radius: 10px; } .mapboxgl-marker svg { -webkit-transform: scale(1.2); transform: scale(1.2); -webkit-animation: marker 1s infinite ease-in-out; animation: marker 1s infinite ease-in-out; } .mapboxgl-marker svg g { fill: #ff7043; } .mapboxgl-marker svg circle { fill: #28292c; } .mapboxgl-marker svg ellipse { fill: #000; } @-webkit-keyframes marker { 0% { -webkit-transform: scale(1.2) translateY(0); transform: scale(1.2) translateY(0); } 50% { -webkit-transform: scale(1.2) translateY(-10px); transform: scale(1.2) translateY(-10px); } 0% { -webkit-transform: scale(1.2) translateY(0); transform: scale(1.2) translateY(0); } } @keyframes marker { 0% { -webkit-transform: scale(1.2) translateY(0); transform: scale(1.2) translateY(0); } 50% { -webkit-transform: scale(1.2) translateY(-10px); transform: scale(1.2) translateY(-10px); } 0% { -webkit-transform: scale(1.2) translateY(0); transform: scale(1.2) translateY(0); } } /* Theme CSS */ .qrt-content-frame .qrt-body { margin-top: -40px; margin-left: -40px; margin-right: -40px; margin-bottom: -40px; width: auto; background-color: #1e1f22; } .qrt-section { padding: 80px 0 40px 0; border-bottom: 1px solid rgba(82, 85, 90, 0.3); } .elementor-widget-quarty-numbers .qrt-section { padding-top: 40px; } .qrt-section-sf { padding-bottom: 0px; } .qrt-section-wb { border-bottom: none; } .qrt-section-title { padding: 0 0 30px 0; } .qrt-section-title .qrt-el-suptitle { padding-top: 5px; } .elementor-section-wrap>.elementor-section:first-child .qrt-section { padding-top: 0px; } .elementor-section-wrap>.elementor-section:last-child .qrt-section { border-bottom: none; } .qrt-section-sf .pagination:last-child, .qrt-section-sf .qrt-bts:last-child { margin-bottom: 40px; } /* - Blog */ .single-portfolio .qrt-half-content-frame .qrt-left-content, .archive .qrt-half-content-frame .qrt-left-content, .single-post .qrt-half-content-frame .qrt-left-content, .single .qrt-half-content-frame .qrt-left-content, .page-template-default .qrt-half-content-frame .qrt-left-content { max-width: 100%; } .qrt-blog-card { margin-bottom: 30px; padding: 30px; background: none; background-color: white; border: none; -webkit-box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); } .qrt-blog-card .qrt-project-category { font-size: 12px; } .qrt-blog-card .qrt-post-cover img { margin-bottom: 30px; } .qrt-blog-card .qrt-el-title { margin: 5px 0 20px 0; font-size: 20px; } .content-sidebar img { max-width: 100%; height: auto; opacity: 1!important; } img { max-width: 100%; } table { width: 100%; margin: 0; padding: 0; border-collapse: collapse; background: none; background-color: white; border: none; color: #28292c; font-size: 14px; -webkit-box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); } select, .content-sidebar select, .wp-block-archives-dropdown select, .wp-block-categories select { -webkit-appearance: none; height: 50px; width: 100%; background-color: white; border: none; color: #28292c; font-size: 14px; padding-left: 15px; padding-right: 15px; -webkit-box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); margin-bottom: 0; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; background-image: url(assets/images/arrow.svg); background-position: calc(100% - 15px) 50%; background-repeat: no-repeat; background-size: 12px 12px; } .content-sidebar table caption { padding: 8px; font-weight: 600; font-size: 12px; border-bottom: none; text-align: center; } .content-sidebar th { padding: 8px 0; font-size: 12px; font-weight: 700; text-align: center; border: none; text-transform: uppercase; } .content-sidebar td { border: none; padding: 8px 0; font-size: 12px; background: none; text-align: center; border: none; } .content-sidebar tfoot td { border: none; } .content-sidebar td.pad { background: none; } .content-sidebar td#today { background: #ff7043; color: #000!important; } .single-post-text h1, .single-post-text h2, .single-post-text h3, .single-post-text h4, .single-post-text h5, .single-post-text h6 { line-height: 1.4; } .single-post-text>*:first-child { margin-top: 0; } .single-post-text>*:last-child { margin-bottom: 0; } .single-post-text img { max-width: 100%; } .single-post-text img+figure { margin-top: 20px; } .single-post-text table { width: 100%; margin: 0; padding: 0; border-collapse: collapse; } .single-post-text table th { padding: 15px 20px; font-size: 14px; font-weight: 700; color: #52555a; background: none; text-align: center; border: 1px solid #eee; border-bottom: none; } .single-post-text table td { border: 1px solid #eee; padding: 15px 20px; font-size: 14px; background: none; } .single-post-text table td#today { background: #ff7043; color: #000!important; font-weight: 700; } .single-post-text table caption { margin: 0 0 10px 0; padding: 0; color: #28292c; font-size: 13px; font-weight: 600; } dt { margin-bottom: 5px; font-weight: 700; } dd { margin-top: 0; margin-bottom: 20px; margin-left: 20px; } @media screen and (max-width: 720px) { .single-post-text th { padding: 10px; font-size: 13px; } .single-post-text td { padding: 10px; font-size: 13px; } } .align-center { text-align: center !important; } .align-right { text-align: right !important; } .align-left { text-align: left !important; } .pull-right { float: right !important; } .pull-left { float: left !important; } .pull-none { float: none !important; } .alignright { margin-left: 20px !important; margin-bottom: 10px !important; float: right !important; max-width: 50% !important; } .alignleft { margin-right: 20px !important; margin-bottom: 10px !important; float: left !important; max-width: 50% !important; } .aligncenter { margin-left: auto !important; margin-right: auto !important; display: block; } .full-width { max-width: 100%; width: 100%; } .full-max-width { max-width: 100%; width: auto; } .centrize { display: table !important; table-layout: fixed !important; height: 100% !important; position: relative !important; top: 0; left: 0; z-index: 2; } .vertical-center { display: table-cell !important; vertical-align: middle !important; } .wp-caption, .wp-caption-text, .wp-block-image figcaption, .wp-block-video figcaption, .wp-block-embed figcaption { max-width: 100%; margin: 0; padding: 5px 10px; text-align: center; font-size: 14px; font-style: italic; opacity: 1; } .wp-caption-text { opacity: 0.7; line-height: 1.4; } .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); -webkit-clip: rect(1px, 1px, 1px, 1px); position: absolute !important; height: 1px; width: 1px; overflow: hidden; } .single-post-text figure .wp-caption-text, .comment-text figure .wp-caption-text, .gallery-caption, .bypostauthor { font-style: italic; } .single-post-text, .comment-text { word-wrap: break-word; } .comment-text { display: flex; flex-direction: column; } .single-post-text>*:first-child, .comment-text>*:first-child { margin-top: 0; } .single-post-text>*:last-child, .comment-text>*:last-child { margin-bottom: 0; } .single-post-text:after { content: ''; position: relative; clear: both; display: block; } .single-post-text .content-box *, .comment-text .content-box * { margin-top: 0; } .single-post-text img, .comment-text img { max-width: 100%; height: auto; } .single-post-text p a, .comment-text p a { color: #28292c; text-decoration: underline; } .single-post-text p a:hover, .comment-text p a:hover { text-decoration: none; } iframe, object { max-width: 100%; } .single-post-text ul, .comment-text ul { margin: 1.2rem 0; padding: 0; list-style: none; } .single-post-text ol, .comment-text ol { margin: 1.2rem 0; padding: 0; list-style-position: inside; } .single-post-text ul ul, .comment-text ul ul, .single-post-text ul ol, .comment-text ul ol, .single-post-text ol ol, .comment-text ol ol, .single-post-text ol ul, .comment-text ol ul { margin-top: 5px; margin-bottom: 5px; margin-left: 10px; } .single-post-text ul>li, .single-post-text ol>li, .comment-text ul>li, .comment-text ol>li { margin: 5px 0; padding: 0 0 0 14px; position: relative; font-weight: 400; } .single-post-text ul>li a, .single-post-text ol>li a, .comment-text ul>li a, .comment-text ol>li a {} .single-post-text ol>li, .comment-text ol>li { margin: 5px 0; padding: 0; position: relative; font-weight: 400; } .single-post-text ul>li:before, .comment-text ul>li:before { margin: 0; content: ''; position: absolute; left: 0; top: 8px; width: 4px; height: 4px; background: #28292c; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; -khtml-border-radius: 4px; } .wp-block-categories-list li, .wp-block-archives-list li, .widget.widget_nav_menu ul li, .widget.widget_pages ul li, .widget_categories ul li {} .wp-block-categories-list li a, .wp-block-archives-list li a, .widget.widget_nav_menu ul li a, .widget.widget_pages ul li a, .widget_categories ul li a {} .wp-block-gallery .blocks-gallery-image, .wp-block-gallery .blocks-gallery-item { padding: 0; } .wp-block-gallery .blocks-gallery-image:before, .wp-block-gallery .blocks-gallery-item:before { display: none; } .single-post-text figure, .comment-text figure { margin: 0 0 20px 0; max-width: 100%; overflow: auto; } .single-post-text figure.wp-block-table, .comment-text figure.wp-block-table { overflow: visible; } .single-post-text figure .wp-caption-text, .comment-text figure .wp-caption-text, .gallery-caption, .bypostauthor { font-style: italic; } .gallery { margin: 30px -10px; } .single-post-text .gallery { margin-bottom: 0; } .gallery .gallery-item { margin: 0; padding: 10px; display: inline-block; vertical-align: top; width: 100%; text-align: center; } .gallery .gallery-item img { max-width: 100%; height: auto; } .gallery.gallery-columns-1 .gallery-item { width: 100%; } .gallery.gallery-columns-2 .gallery-item { width: 50%; } .gallery.gallery-columns-3 .gallery-item { width: 33.333%; } .gallery.gallery-columns-4 .gallery-item { width: 25%; } .gallery.gallery-columns-5 .gallery-item { width: 20%; } .gallery.gallery-columns-6 .gallery-item { width: 16.666%; } .gallery.gallery-columns-7 .gallery-item { width: 14.28%; } .gallery.gallery-columns-8 .gallery-item { width: 12.5%; } .gallery.gallery-columns-9 .gallery-item { width: 11.111%; } .comment-form {} .comment-form .group-val { position: relative; margin-bottom: 20px; line-height: normal; } .comment-form .group-val input, .comment-form .group-val textarea, form.post-password-form label input {} .comment-form .group-val textarea { height: 150px; } .comment-form .group-val input:focus, .comment-form .group-val textarea:focus { outline: none; } .comment-form .btn.fill, form.post-password-form input[type="submit"] { margin: 0; overflow: hidden; position: relative; padding: 0 35px; height: 45px; font-size: 12px; line-height: 45px; background: #ff7043; letter-spacing: 1.5px; font-weight: 600; text-align: center; text-transform: uppercase; box-shadow: 0 1px 4px 0 rgba(15, 15, 20, 0.1); color: #20202a; transition: 0.4s ease-in-out; border: none; outline: none; cursor: pointer; border-radius: 0; } .comment-form .btn.fill:hover, form.post-password-form input[type="submit"]:hover { -webkit-transform: translateY(-2px); transform: translateY(-2px); color: #1e1e28; } .comment-info { padding: 15px 0 0 0; color: #777; font-size: 12px; text-transform: uppercase; letter-spacing: 0.5px; } .comment-info span.comment-reply { position: absolute; top: 0; right: 0; } .comment-reply-link:after { content: ''; margin-left: 8px; content: '\f112'; display: inline-block; vertical-align: middle; font-family: 'FontAwesome'; font-size: 12px; line-height: 14px; opacity: 0.8; } .post-comments .comments, .post-comments .children { margin: 0; padding: 0; list-style: none; } .comments>.post-comment { background: #fff; box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); padding: 30px; margin-bottom: 30px; -webkit-transition: 0.55s ease-in-out; transition: 0.55s ease-in-out; } .post-comments .post-comment .image { float: left; width: 80px; height: 80px; } .post-comments .post-comment .image img { width: 100%; height: 100%; } .post-comments .post-comment .desc { margin-left: 100px; position: relative; } .post-comments .post-comment .desc .name { padding: 0; margin: 0 0 1rem 0; font-size: 16px; line-height: 1.2; font-weight: 600; color: #28292c; } .post-comments .post-comment .desc .name a { color: #28292c; } .post-comments .post-comment .desc p:first-child { margin-top: 0; } .post-comments .post-comment .desc p:last-child { margin-top: 0; } .post-comment.trackback .image, .post-comment.pingback .image { display: none!important; } .post-comment.trackback .desc, .post-comment.pingback .desc { margin-left: 0!important; } .post-comments .children .post-comment { margin-top: 30px; padding: 30px 0 0 40px; border-top: 1px solid rgba(255, 255, 255, 0.07); } .form-comment .comment-respond { margin-top: 0; } .comment .comment-respond input, .comment .comment-respond textarea { background: #f1f1f1; } .comment-respond { position: relative; margin-top: 40px; margin-bottom: 25px; } .comment-respond .title_inner small { position: absolute; top: 10px; left: auto; right: 0; display: block; font-size: 14px; white-space: nowrap; } .comment-respond .title_inner small a { text-decoration: none; opacity: 0.8; } .comment-respond .title_inner small a:hover { opacity: 1; } .post-text-bottom { margin: 35px 0 0 0; } .post-text-bottom .share-btn { position: relative; display: inline-block; top: 1px; margin-left: 7px; margin-right: 7px; font-size: 16px; } .social-share a { margin-right: 15px; display: inline-block; vertical-align: top; text-align: center; color: #28292c; transition: all 0.7s cubic-bezier(0.165, 0.85, 0.45, 1); -moz-transition: all 0.7s cubic-bezier(0.165, 0.85, 0.45, 1); -webkit-transition: all 0.7s cubic-bezier(0.165, 0.85, 0.45, 1); -o-transition: all 0.7s cubic-bezier(0.165, 0.85, 0.45, 1); } .social-share a:last-child { margin-right: 0; } .social-share a .icon { font-size: 16px; color: #28292c; } .social-share a:hover { color: #28292c; opacity: 1; } .social-share a:hover .icon { color: #28292c; } .post-text-bottom span.cat-links a { color: #28292c; font-size: 13px; text-transform: uppercase; font-weight: 700; letter-spacing: 0.5px; } .post-text-bottom span.cat-links a:hover { text-decoration: underline; } .post-text-bottom .tags-links { margin: 15px 0 0 0; display: block; line-height: 32px; } .post-text-bottom .tags-links *:nth-child(1) { margin-left: 5px; } .post-text-bottom .tags-links a, .post-text-bottom .tags-links span, .content-sidebar .tagcloud a, .wp-block-tag-cloud .tag-cloud-link { margin: 0 7px 8px 0; display: inline-block; vertical-align: top; padding: 0 10px; height: 32px; line-height: 32px; font-weight: 700; letter-spacing: 1px; font-size: 11px!important; color: #28292c; text-decoration: none; text-transform: uppercase; background-color: white; -webkit-box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); border: none; } .content-sidebar .tagcloud a { margin: 0 5px 5px 0; font-size: 13px!important; } .qrt-pagination { position: relative; } .qrt-pagination:after { content: ''; position: relative; display: block; clear: both; } @media (max-width: 480px) { .comment-respond .title_inner small { position: relative; top: 0; left: 0; } .section .content .description-col .details-list li { width: 100%; } } @media (max-width: 1160px) { .post-comments .post-comment .image { width: 60px; height: 60px; } .post-comments .post-comment .desc { margin-left: 80px; } .post-comments .post-comment.pingback .desc { margin-left: 0; } .post-comments ul.children { padding: 20px 20px 0 80px; } .post-comments ul.children ul.children { padding: 20px 0 0 20px; } .post-comments ul.children ul.children ul.children ul.children { padding: 20px 0 0 10px; } } @media (max-width: 840px) { .post-comments ul.children { padding: 20px 20px 0 20px; } .post-comments ul.children ul.children { padding: 20px 0 0 20px; } .post-comments ul.children ul.children ul.children { padding: 20px 0 0 20px; } .post-comments ul.children ul.children ul.children ul.children { padding: 20px 0 0 10px; } } @media (max-width: 480px) { .section .content .comment-respond .title.comment-reply-title { text-align: left; } .post-comments ul.children { padding: 15px 15px 15px 15px; } .post-comments ul.children ul.children { padding: 15px 0 0 10px; } .post-comments ul.children ul.children ul.children { padding: 15px 0 0 5px; } .post-comments ul.children ul.children ul.children ul.children { padding: 15px 0 0 5px; } .post-comments .post-comment .image { width: 40px; height: 40px; } .post-comments .post-comment .desc { margin-left: 55px; } .post-comments .post-comment.pingback .desc { margin-left: 0; } .gallery .gallery-item { width: 100%; } .gallery.gallery-columns-1 .gallery-item { width: 100%; } .gallery.gallery-columns-2 .gallery-item { width: 100%; } .gallery.gallery-columns-3 .gallery-item { width: 100%; } .gallery.gallery-columns-4 .gallery-item { width: 100%; } .gallery.gallery-columns-5 .gallery-item { width: 100%; } .gallery.gallery-columns-6 .gallery-item { width: 100%; } .gallery.gallery-columns-7 .gallery-item { width: 100%; } .gallery.gallery-columns-8 .gallery-item { width: 100%; } .gallery.gallery-columns-9 .gallery-item { width: 100%; } } /* Sidebar */ .content-sidebar { position: relative; } .content-sidebar .widget { margin-bottom: 50px; } .content-sidebar .searchform, .wp-block-search { position: relative; } .wp-block-search { max-width: 230px; } .content-sidebar .searchform label { display: block; } .screen-reader-text { clip: rect(1px, 1px, 1px, 1px); -webkit-clip: rect(1px, 1px, 1px, 1px); position: absolute !important; height: 1px; width: 1px; overflow: hidden; } .comment-form-cookies-consent label { display: inline; } .rssSummary {} .content-sidebar .searchform input[type=text], .content-sidebar .searchform input[type=email], .content-sidebar .searchform input[type=password], .content-sidebar .searchform input[type=datetime], .content-sidebar .searchform input[type=date], .content-sidebar .searchform input[type=month], .content-sidebar .searchform input[type=time], .content-sidebar .searchform input[type=week], .content-sidebar .searchform input[type=search], .content-sidebar .searchform textarea, .content-sidebar .searchform textarea.form-control, .wp-block-search input[type=text], .wp-block-search input[type=email], .wp-block-search input[type=password], .wp-block-search input[type=datetime], .wp-block-search input[type=date], .wp-block-search input[type=month], .wp-block-search input[type=time], .wp-block-search input[type=week], .wp-block-search input[type=search], input[type=text], input[type=email], input[type=password], input[type=datetime], input[type=date], input[type=month], input[type=time], input[type=week], input[type=search], textarea, .wp-block-search textarea, .wp-block-search textarea.form-control { height: 50px; width: 100%; background: white; border: none; color: #28292c; font-size: 14px; padding-left: 15px; padding-right: 15px; letter-spacing: 0; -webkit-box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); margin-bottom: 0; -webkit-transition: 0.4s ease-in-out; transition: 0.4s ease-in-out; } textarea { padding: 15px; } .content-sidebar .searchform .searchform-btn, .searchform-btn, .wp-block-search__button { position: absolute; right: 15px; top: 50%; margin-top: -18px; margin-bottom: 0; background-color: transparent; border: 0; z-index: 2; } .searchform-btn, .wp-block-search__button { padding: 0; width: 14px; height: 31px; background: url(assets/images/search.svg) no-repeat center center !important; background-size: contain !important; font-size: 0; opacity: .7; } .content-sidebar .widget-title { margin-top: 0; margin-bottom: 20px; padding-bottom: 20px; position: relative; font-size: 18px; font-weight: 600; color: #28292c; } .content-sidebar .widget-title:before { content: ''; position: absolute; left: 0; bottom: 0; width: 20px; height: 2px; background: #ff7043; z-index: 3; } .content-sidebar a { color: #28292c; } .content-sidebar a:hover { color: #28292c; text-decoration: underline; } .content-sidebar ul { padding-left: 0; margin-top: 10px; margin-bottom: 10px; list-style: none; } .content-sidebar ul ul { margin-left: 0; } .content-sidebar ul li { margin-bottom: 10px; position: relative; } .wp-block-categories-list li ul, .wp-block-archives-list li ul { margin-left: 0; } .wp-block-categories-list li, .wp-block-archives-list li, .widget.widget_nav_menu ul li, .widget.widget_pages ul li, .widget_categories ul li { margin-bottom: 10px; padding-left: 9px; position: relative; } .wp-block-categories-list li ul li:before, .wp-block-archives-list li ul li:before, .widget.widget_nav_menu ul li ul li:before, .widget.widget_pages ul li ul li:before, .widget_categories ul li ul li:before { content: ''; position: absolute; top: 8px; left: 0; width: 5px; height: 1px; background: #999; opacity: 0.8; } a.rsswidget { margin-right: 3px; display: inline-block; font-size: 14px; font-weight: 600; text-decoration: none; } .rss-date, .widget_rss cite { margin: 5px 0 10px 0; display: block; font-size: 14px; font-weight: 400; opacity: 0.8; } .widget_rss cite { margin: 5px 0 20px 0; font-style: normal; } .post-edit-link { text-decoration: underline; } .post-edit-link:hover { text-decoration: none; } .edit-link { margin-top: 30px; display: block; } .sticky { position: relative; } .sticky:before { content: ''; position: absolute; left: -30px; top: -30px; bottom: -30px; width: 4px; background: #ff7043; z-index: 3; } .post-comments { margin-top: 50px; } .title.comment-reply-title, .post-comments .title { margin: 0 0 20px 0; font-size: 20px; font-weight: 800; color: #28292c; } .wp-block-cover, .wp-block-cover-image { margin: 30px 0; } .wp-block-cover.alignleft, .wp-block-cover-image.alignleft, .wp-block-cover.alignright, .wp-block-cover-image.alignright { margin-bottom: 30px!important; } .wp-block-cover p a, .wp-block-cover-image p a { color: #fff; text-decoration: none; } .wp-block-cover p a:hover, .wp-block-cover-image p a:hover { text-decoration: underline; } blockquote p { margin-bottom: 0.5rem!important; color: #28292c; font-style: normal; font-weight: 600; } blockquote p:first-child { margin-top: 0; } blockquote cite { color: #52555a; font-size: 13px; font-style: normal; } blockquote cite br { display: none; } blockquote.has-text-align-right cite:before { display: none; } blockquote.has-text-align-right cite:after { margin-left: 5px; content: '-'; } .wp-block-quote.is-large, .wp-block-quote.is-style-large { padding: 0 50px; } .wp-block-pullquote { padding-top: 0; padding-bottom: 0; } .wp-block-pullquote blockquote { padding: 50px; margin-bottom: 0; } .wp-block-pullquote blockquote:before { left: 50%; margin-left: -12px; } .wp-block-pullquote.is-style-solid-color { color: #28292c; border: none; } .wp-block-pullquote.is-style-solid-color p { color: #28292c; } .wp-block-pullquote.is-style-solid-color blockquote { border: none; color: #52555a; } .wp-block-pullquote.is-style-solid-color blockquote:before { left: 0; top: 50px; margin-left: 0; } .wp-block-calendar, .wp-block-archives, .wp-block-categories { margin: 1.2rem 0; max-width: 380px; } .wp-block-search .wp-block-search__label { display: none; } .wp-block-group.has-background { padding: 50px; color: #101010; } .wp-block-group.has-background p:first-child { margin-top: 0; } .wp-block-group.has-background p:last-child { margin-bottom: 0; } .wp-block-media-text.has-background { color: #101010; } .wp-block-media-text.has-background .has-large-font-size { line-height: 1.7; } hr.wp-block-separator { margin: 30px 0; border: none; border-bottom: 1px solid #585d65; max-width: 50px; } hr.wp-block-separator.is-style-wide { max-width: 100%; } .wp-block-separator.is-style-dots:before { color: #ccc; } .single-post-text h1, .single-post-text h2, .single-post-text h3, .single-post-text h4, .single-post-text h5, .single-post-text h6 { margin-top: 2rem; margin-bottom: 1.25rem; line-height: 1.4; } .single-post-text h1+h2, .single-post-text h2+h3, .single-post-text h3+h4, .single-post-text h4+h5, .single-post-text h5+h6, .single-post-text h6 { margin-top: 1.25rem; } .single-post-text>*:first-child, .single-post-text>div>*:first-child { margin-top: 0; } .single-post-text p { margin-top: 1.4rem; margin-bottom: 1.4rem; -ms-word-wrap: break-word; word-wrap: break-word; } .single-post-text table tbody th { background: transparent; } .post .single-post-text, .content-box, .post-comments { font-size: 16px; color: #52555a; line-height: 1.7; } .wp-block-button { margin-bottom: 1.25rem; } .wp-block-button a.wp-block-button__link { padding: 13px 35px; background: #ff7043; color: #28292c; font-size: 12px; font-weight: 600; letter-spacing: 1.5px; text-transform: uppercase; border-radius: 46px; -webkit-border-radius: 46px; } .wp-block-button a.wp-block-button__link:hover { color: #28292c; } .wp-block-button.is-style-outline a.wp-block-button__link { padding-top: 11px; padding-bottom: 11px; border: 2px solid #ff7043; color: #28292c; background: none; } .wp-block-button.is-style-squared a.wp-block-button__link { border-radius: 0; -webkit-border-radius: 0; } .wp-block-columns { margin-bottom: 0; } .single-post-text table caption { margin: 0 0 10px 0; padding: 0; caption-side: top; } .wp-calendar-nav:after { content: ''; position: relative; display: block; clear: both; } .wp-calendar-nav span.wp-calendar-nav-prev { float: left; color: #28292c; } .wp-calendar-nav span.wp-calendar-nav-next { float: right; color: #28292c; } .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 { font-size: 14px; } .has-avatars .wp-block-latest-comments__comment .wp-block-latest-comments__comment-excerpt a, .has-avatars .wp-block-latest-comments__comment .wp-block-latest-comments__comment-meta a { font-weight: 600; } .has-avatars .wp-block-latest-comments__comment .wp-block-latest-comments__comment-excerpt { margin-top: 8px; margin-bottom: 22px; } .wp-block-latest-comments__comment { margin: 1.2rem 0!important; font-size: 14px; } .wp-block-latest-comments__comment a { font-weight: 600; } pre.wp-block-code, pre { padding: 20px; overflow: auto; white-space: pre-wrap; background: white; -webkit-box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); font-size: 14px; } .wp-block-table.is-style-stripes tbody tr:nth-child(odd) { background: #eee; } /* section portfolio tablet */ @media (max-width: 992px) { .content-sidebar { padding: 0 35px; width: 31.5%; } .sticky:before { left: 0; top: 0; bottom: 0; } } /* section portfolio mobile */ @media (max-width: 720px) { .content-sidebar { padding: 0; float: none; width: 100%; } .single-post-text table th { padding: 8px; } .single-post-text table td { padding: 8px; } .post-comments .children .post-comment { margin-top: 10px; padding: 30px 0 0 20px; } .post-comments .children .post-comment { padding-left: 0; } .post-comments ul.children ul.children ul.children { padding: 15px 0 0 10px; } } /* ----------------------------------------------------------------- - 404 ----------------------------------------------------------------- */ .parallax-container { overflow: hidden; } .error-page { min-height: calc(100vh - 180px); text-align: center; align-items: center; justify-content: center; display: flex; } .admin-bar .error-page { min-height: calc(100vh - 212px); } .error-page .description { margin-bottom: 0; } .mask-object { filter: drop-shadow(0 20px 30px rgba(25, 25, 27, 0.1)); margin-bottom: 2rem; width: 30vw; transition: all 0.8s cubic-bezier(0.2, 1, 0.8, 1); } .error-page__num { color: #ff7043; font-size: 220px; display: block; height: auto; line-height: 220px; font-weight: 700; } @media only screen and (max-width: 992px) { .mask-object { width: 50vw; } .error-page__num { font-size: 160px; line-height: 160px; } } @media only screen and (max-width: 580px) { .mask-object { width: 80vw; } .error-page__num { font-size: 120px; line-height: 120px; } } section.elementor-element:last-child .section { border-bottom: none; } .wpcf7 form.invalid .wpcf7-response-output, .wpcf7 form.unaccepted .wpcf7-response-output, .wpcf7 form.sent .wpcf7-response-output { color: #28292c; padding: 10px; margin: 20px 0 0 0; } .wpcf7 form.sent .wpcf7-response-output { border-color: #46b450; } .wpcf7-not-valid-tip { padding-top: 5px; } ul.blocks-gallery-grid { margin: 0 !important; } /* Default Scrolling */ .default--scrolling #qrt-scroll-content, .default--scrolling #qrt-scroll-info { overflow: auto; -webkit-overflow-scrolling: touch; transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); } .page-links { margin: 0; padding: 1.2rem 0; clear: both; } .content-box p:last-child { margin-bottom: 0; } .description-search { margin-bottom: 0; } .content-sidebar .widget>ul>li, .content-sidebar .widget div>ul>li { padding-left: 0; } .content-sidebar select { margin-bottom: 0; } .qrt-testimonial-row { margin-left: -10px; margin-right: -10px; } .col__sedebar { padding-left: 20px; } .qrt-post-cover img { width: 100%; height: auto; } .qrt-logo-text { font-family: "Commissioner", sans-serif; color: #fff; font-size: 18px; line-height: 40px; font-weight: 700; width: 150px; display: block; text-transform: uppercase; } .qrt-logo-sub { display: none; } .wp-block-cover-image-text, .wp-block-cover-text, section.wp-block-cover-image h2 { color: #fff!important; } .qrt-section-title .qrt-el-suptitle { margin: 20px 0 0 0; padding: 5px 10px; background-color: white; color: #28292c; display: inline-block; font-size: 11px; text-transform: uppercase; height: 30px; line-height: 20px; letter-spacing: 1px; -webkit-box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); box-shadow: 0 1px 2px 0 rgba(45, 45, 60, 0.1); font-weight: 700; } .qrt-section-title .qrt-el-suptitle.qrt-el-date { background-color: transparent; border: 1px solid #52555a; color: #52555a; } .qrt-app .qrt-content .qrt-content-frame { min-height: calc(100vh - 100px); } .admin-bar .qrt-app .qrt-content .qrt-content-frame { min-height: calc(100vh - 132px); } .qrt-el-more { display: block; margin-top: 1rem; } .textwidget .wp-caption { padding: 0; margin-bottom: 1rem; } .qrt-content-none .qrt-el-title { margin-bottom: 0.5rem; } .elementor-738 .elementor-element.elementor-element-b13de92 { margin-top: -40px; margin-bottom: 0px; } .elementor-646 .elementor-element.elementor-element-b13de92 { margin-top: -40px; margin-bottom: 0px; } .elementor-750 .elementor-element.elementor-element-b13de92 { margin-top: -40px; margin-bottom: 0px; } .elementor-405 .elementor-element.elementor-element-b13de92 { margin-top: -40px; margin-bottom: 0px; } .elementor-409 .elementor-element.elementor-element-0a7669a { margin-top: 40px; margin-bottom: 0px; } .post-text-bottom .byline a { color: #28292c; font-weight: 500; text-decoration: underline; } .post-text-bottom .byline a:hover { text-decoration: none; } .qrt-section-description:last-child { margin-bottom: 0px; } .qrt-section-description:last-child p:last-child { margin-bottom: 0px; } .qrt-price .qrt-price-body .qrt-price-list ul li del { opacity: 0.6; } .qrt-member-name, .qrt-page-cover .qrt-about-info .qrt-table li>span { color: #c9c9c9; opacity: 1; } .alignwide, .alignnone { clear: both; } .qrt-section-title.archive-row-title { padding-left: 10px; padding-right: 10px; } .page .qrt-section-title.archive-row-title, .single .qrt-section-title.archive-row-title, .single-post .qrt-section-title.archive-row-title { padding-left: 0; padding-right: 0; } .row.archive-row .qrt-post-cover { text-align: center; display: block; } .row.archive-row .qrt-post-cover img { max-width: 100%; width: auto; } .qrt-blog-card .qrt-el-description p { margin-bottom: 0; } @media (max-width: 768px) { .blocks-gallery-grid.alignleft, .blocks-gallery-grid.alignright, .wp-block-gallery.alignleft, .wp-block-gallery.alignright { width: 100%!important; max-width: 100%!important; margin-right: 0!important; float: none!important; } .qrt-blog-card { padding: 20px; } .sticky:before { left: -20px; top: -20px; bottom: -20px; } .col__sedebar { padding-left: 0; margin-top: 40px; } .qrt-portfolio-pagination .qrt-pagination-center { display: none; } .wp-block-group.has-background { padding: 20px; } .qrt-content-frame .qrt-body { margin-top: -20px; margin-bottom: -20px; margin-left: -20px; margin-right: -20px; } .qrt-banner-title .qrt-text br { display: none; } } .qrt-app .qrt-top-bar .qrt-search form input { background-color: #f0f3f7; } .qrt-app .qrt-top-bar .qrt-search { pointer-events: none; } .qrt-app .qrt-top-bar .qrt-search.qrt-active { pointer-events: auto; } .qrt-section, .elementor-container.elementor-column-gap-default .elementor-row, .elementor-widget-quarty-about-resume, .elementor-widget-text-editor, .content-box, .post-comments { margin-left: auto; margin-right: auto; max-width: 1120px; } .single-portfolio .qrt-section-sf, .single-post .qrt-section-sf, .elementor-widget-quarty-portfolio .qrt-section, .elementor-widget-quarty-blog-grid .qrt-section { max-width: 100%; } .elementor-widget-quarty-project-image-gallery .qrt-section { padding-top: 40px; } .elementor-widget-quarty-banner .row { padding-bottom: 0; } /*default scroll*/ .default--scrolling .qrt-app .qrt-content { top: 0; padding-top: 80px; } .default--scrolling .qrt-app .qrt-left-bar .qrt-social-links { bottom: 80px; } .default--scrolling .qrt-content-frame .qrt-body { margin-bottom: 0; } .default--scrolling .qrt-app .qrt-left-bar:after { content: ''; position: fixed; left: 0; bottom: 0; width: 1000%; height: 10px; background: #1e1f22; } .default--scrolling .qrt-app .qrt-preloader { position: fixed; height: 100vh; } .default--scrolling .qrt-app { overflow: hidden; width: auto!important; height: auto!important; display: block; } .default--scrolling #qrt-scroll-content, .default--scrolling #qrt-scroll-info { overflow: hidden; transform: none; -webkit-transform: none; width: auto!important; height: auto!important; } .default--scrolling .qrt-app .qrt-left-bar { position: fixed; } .default--scrolling .qrt-app .qrt-content .qrt-content-frame { padding-bottom: 0; } @media (min-width: 768px) { .default--scrolling .qrt-dynamic-content { padding-left: 80px; } .default--scrolling .qrt-call-to-action { margin: 0 -40px; } } @media (max-width: 768px) { .default--scrolling .qrt-app .qrt-top-bar { position: fixed; } .default--scrolling.admin-bar .qrt-app .qrt-top-bar { position: fixed; top: 46px; } } .single-portfolio .elementor-widget-quarty-banner { margin-bottom: 50px; } .qrt-half-banner.qrt-left-align .qrt-banner-title .qrt-divider-2 { display: none; } .qrt-app .qrt-top-bar .qrt-buttons, .qrt-app .qrt-top-bar .qrt-logo, .qrt-app .qrt-top-bar .qrt-symbol { z-index: 2; } @media (max-width: 768px) { .qrt-app .qrt-top-bar .qrt-search { background: transparent; } .qrt-app .qrt-top-bar { -webkit-transform-style: unset; transform-style: unset; } }
Save Changes
Rename File
Rename