@charset "UTF-8";

/*
Theme Name:Ultimate Buildmart
Theme URI: https://wordpress.org/themes/ultimatebuildmart/
Author: the WordPress team
Author URI: https://wordpress.org/
Description:ultimatebuildmart is a blank canvas for your ideas and it ultimatebuildmartes the block editor your best brush. With new block patterns, which allow you to create a beautiful layout in a matter of seconds, this theme’s soft colors and eye-catching — yet timeless — design will let your work shine. Take it for a spin! See howultimatebuildmart elevates your portfolio, business website, or personal blog.
Requires at least: 5.3
Tested up to: 6.6
Requires PHP: 5.6
Version: 2.3
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain:ultimatebuildmart
Tags: one-column, accessibility-ready, custom-colors, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, blog, portfolio

ultimatebuildmart WordPress Theme, (C) 2020 WordPress.org */

body #content .sticky-cards-wrapper {position: relative; overflow: visible !important;}
body #content .sticky-cards-wrapper .sticky-card {position: sticky !important; min-height: 100vh; background-size:cover !important; background-position: center center !important; background-repeat: no-repeat !important; overflow: hidden; top: 0; margin-bottom: 0 !important; padding: 0 !important;}
body #content .sticky-cards-wrapper .sticky-card .vc_column-inner {padding: 0 !important;}
body #content .sticky-cards-wrapper .sticky-card.sticky-card-1 {z-index: 1;}
body #content .sticky-cards-wrapper .sticky-card.sticky-card-2 {z-index: 2;}
body #content .sticky-cards-wrapper .sticky-card.sticky-card-3 {z-index: 3;}
body #content .sticky-cards-wrapper .sticky-card.sticky-card-4 {z-index: 4;}
body #content .sticky-cards-wrapper .sticky-card.sticky-card-5 {z-index: 5;}
body #content .sticky-cards-wrapper .sticky-card.sticky-card-6 {z-index: 6;}

/* Search Functionality */
/* .search-icon {
    cursor: pointer;
    transition: all 0.3s;
}
.search-icon:hover {
    color: #BC3810;
}
.search-overlay .container {
    display: flex;
    align-items: center;
    gap: 1rem;
    position: relative;
}
.search-overlay .close-search {
    cursor: pointer;
    font-size: 1.5rem;
    color: #000;
    transition: all 0.3s;
}
.search-overlay .close-search:hover {
    color: #BC3810;
}
.search-overlay.active {
    z-index: 999 !important;
} */

.ajaxsearchlite {
  display: inline-block;
}
.ajaxsearchlite .probox {
  display: none; /* hides the input field */
}
.ajaxsearchlite .magnifier {
  display: inline-block; /* shows only the magnifying glass icon */
  cursor: pointer;
}




/* Product CSS */
body #content .container-main {display: flex;width: 100%;height: 700px;overflow: hidden; align-items:center;}
body #content .panel{flex: 1;position: relative;background-size: cover;background-position: center ;transition: flex 0.5s ease-in-out;cursor: pointer;display: flex;align-items: flex-end;justify-content: center; height:85%;}
body #content .panel:hover {flex: 3;}
body #content .panel.active{flex: 3;}
body #content .panel1.active{background-position:center;}
body #content .panel.active .vertical-text{opacity: 0;}
body #content .panel .vertical-text{font-size: var(--global-font-family);font-size: 1.8rem;font-weight: 400;
position: absolute;bottom: 0;left: 20%;transform: rotate(-90deg);transform-origin: left top;color: #fff;text-shadow: 1px 1px 3px rgba(0,0,0,0.6); white-space: nowrap;width: auto;z-index: 2;padding:0 1rem;}
body #content .panel .content {position: absolute;bottom: 20px;left: 0px;width:100%;background: #bc3810b8;color: #fff;padding: 15px;opacity: 0;transition: opacity 0.3s;}
body #content .panel.active .content {opacity: 1;}
body #content .panel:not(.active) h2{color: #fff;}
body #content .panel:not(.active)::after {content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0, 0, 0, 0.5);pointer-events: none;transition: background 0.3s ease;}
body #content .panel:not(.active):hover::after {background: rgba(0, 0, 0, 0.5);}
body #content .panel .content h2{font-size: 1.8rem;font-family: var(--global-font-family);font-weight: 400;margin-bottom: 1rem;}
body #content .panel .content p{font-size: 1rem;font-family: var(--global-font-family);font-weight: 400;color: #fff;}