LEI - NULLSEC PH [WAF BYPASS] LOGOUT

ROOT: /var/www/html/assets/scss/

EDIT: _shop.scss

/* 13.shop */
.shop-service{
    & img{
        margin-bottom: 20px;
    }
    & h4{
        font-size: 16px;
        letter-spacing: 2px;
        margin-bottom: 10px;
    }
    & p{
        margin-bottom: 0;
        font-size: 16px;
    }
}
.banner-box{
    border-top: 2px solid #f1f7ff;
    padding-top: 50px;
}
.banner{
    & img{
        width: 100%; 
    }
}
.product{
    &__img{
        position: relative;
    }
    &__content{

}
    &:hover{
        & .product-action{
            & a{
                margin: 0 5px;
                opacity: 1;
                visibility: visible;
            }
        }
    }
}

.product-action{
    position: absolute;
    left: 0;
    right: 0;
    bottom: 30px;
    & a{
        height: 50px;
        display: inline-block;
        width: 50px;
        background: #fff;
        line-height: 50px;
        color: $theme-color;
        margin: 0 8px;
        opacity: 0;
        visibility: hidden;
        &:hover{
            background: $theme-color;
            color: $white;
        }
    }
}

.pro-cat{
    margin-bottom: 15px;
    display: block;
    & a{
        color: $theme-color;
        font-size: 14px;
        letter-spacing: 2px;
        font-weight: 500;
        text-transform: uppercase;
    }
}
.pro-title{
    margin-bottom: 12px;
    & a{
        font-size: 24px;
        &:hover{
            color: $theme-color;
        }
    }
}
.price{
    & span{
        color: #8e84b8;
        font-size: 14px;
        display: inline-block;
        margin: 0 5px;
        &.old-price{
            color: #b7afd5;
            text-decoration: line-through
        }
    }
}

.product-showing{
    & p{
        margin: 0;
        border: 2px solid $border-color;
        padding: 17px 30px;
        text-align: center;
        line-height: 1;
        display: inline-block;
        text-transform: uppercase;
        font-size: 12px;
        letter-spacing: 2px;
        font-weight: 500;
        @media #{$xs}{
            padding: 17px 15px;
        }
    }
}
.pro-filter{
    position: relative;
    display: inline-block;
    @media #{$xs}{
        float: left;
    }
    & select{
        border: 2px solid $border-color;
        padding: 17px 30px;
        display: inline-block;
        text-transform: uppercase;
        font-size: 12px;
        letter-spacing: 2px;
        line-height: 1;
        color: $body-color;
        appearance: none;
        -moz-appearance: none;
        width: 145px;
        font-weight: 500;
    }
    & span {
        right: 15px;
        top: 16px;
        position: absolute;
        color: #758799;
        font-size: 12px;
    }
}

.shop-tab{
    & ul{
        & li{
            margin-left: 20px;
            @media #{$xs}{
                margin-left: 10px;
            }
            & a{
                font-size: 16px;
                font-weight: 500;
                color: $body-color;
                letter-spacing: 2px;
                padding: 0;
                text-transform: uppercase;
                position: relative;
                height: 50px;
                width: 50px;
                border-radius: 50%;
                background: #f6f6ff;
                line-height: 50px;
                text-align: center;
                &.active{
                    color: white;
                    background: $theme-color;

}

}
        }
    }
}

.shop-thumb-tab{
    width: 160px;
    float: left;
    @media #{$xs}{
        float: none;
        width: 100%;
        margin-bottom: 0;
    }
    & ul{
        @media #{$xs}{
            margin: 0 -5px;
        }
        & li{
            margin-bottom: 20px;
            @media #{$xs}{
                width: 33.33%;
                float: left;
                padding: 0 5px;
            }
            & a{
                padding: 0;
            }
            & img{width:100%;}
        }
    }

}
.product-details-img {
	margin-left: 180px;
    overflow: hidden;
    @media #{$xs}{
        margin-left: 0;
    }
}
.product-large-img img {
	width: 100%;
}

.product-details-title{
    & p{
        color: #6a667b;
        font-size: 12px;
        text-transform: uppercase;
        font-weight: 500;
        letter-spacing: 1px;
        margin-bottom: 10px;
    }
    & h1{
        font-size: 40px;
        margin: 0;
        line-height: 1.2;
        letter-spacing: -2px;
        margin-bottom: 15px;
        @media #{$xs}{
            font-size: 36px;
        }
    }
}

.details-price{
    & span{
        color: $theme-color;
        font-size: 20px;
        font-weight: 300;
        font-family: $nunito;
        font-weight: 700;
        margin-left: 0;
        margin-right: 10px;
    }
}
.details-price {
    border-bottom: 2px solid $border-color;
}
.product-cat{
    & span{
        text-transform: uppercase;
        font-size: 14px;
        font-weight: 500;
        color: $black;
    }
    & a{
        text-transform: uppercase;
        font-size: 14px;
        font-weight: 500;
        letter-spacing: 2px;
        &:hover{
            color: $theme-color;

}
    }
}
.product__img img {
	width: 100%;
}
.product-social{
    & a{
        margin-right: 10px;
        background:#f5f5ff;
        height: 50px;
        width: 50px;
        line-height: 48px;
        border-radius: 30px;
        color: $body-color;
        display: inline-block;
        text-align: center;
        font-size: 14px;
        @media #{$xs}{
            margin-bottom: 10px;
        }
        &:hover{
            background: $theme-color;
            color: $white; 
        }
    }
}
.plus-minus{
    display: inline-block;
    @media #{$xs}{
        display: block;
        margin-bottom: 15px;
    }
    @media #{$sm}{
        display: inline-block;
        margin-bottom: 0;
    }
}

.action-btn {
	background: $theme-color;
    padding: 20px 25px;
    border: none;
    margin-left: 15px;
    color: $white;
    display: inline-block;
    border-radius: 4px;
        &:hover{
            background: $theme-color;
            color: $white;
        }
}
.product-action-list{
    & a{
        float: left;
    }
    & a.btn{
        @media #{$xs}{
            padding: 23px 30px;
            margin-bottom: 7px;
        }
    }
    & a.action-btn{
        @media #{$xs}{
            margin-left: 5px;
            margin-bottom: 7px;
        }
    }
}

.cart-plus-minus{
    & input{
        height: 60px;
        width: 100px;
        border-radius: 5px;
        border: 2px solid $border-color;
        text-align: center;
        -moz-appearance: none;
        appearance: none;
    }
}
.cart-plus-minus {
	display: inline-block;
	position: relative;
	margin-right: 15px;
}
.cart-plus-minus .qtybutton {
	position: absolute;
	top: 15px;
	left: 17px;
	font-size: 20px;
    color: #c4bedd;
    cursor: pointer;
}
.cart-plus-minus .inc{
    left: auto;
    right: 17px;
}

.additional-info .table td, .additional-info .table th {
	padding: .75rem 0;
	vertical-align: top;
	border-top: 1px solid #f6f6f6;
	font-weight: 400;
}

.shop-cat{
    & a{
        padding: 45px 30px;
        border: 2px solid $border-color;
        display: block;
        & i{
            font-size: 100px;
            color: $theme-color;
            margin-bottom: 30px;
            transition: .3s;
        }
        & h4{
            text-transform: uppercase;
            font-size: 16px;
            font-weight: 700;
            font-family: $nunito;
            font-weight: 700;
            transition: .3s;
            letter-spacing: 1px;
        }
        &:hover{
            background: $theme-color;
            border-color: $theme-color;
            & i{
                color: $white;
            }
            & h4{
                color: $white;
            }
        }
    }
}

.product-list-content{
    & .price {
        & span:first-child{
            margin-left: 0;
        }
    }
}

.tab-menu{
    & li{
        margin: 0 10px;
        @media #{$xs}{
            margin-bottom:20px;
        }
        & a{
            font-size: 14px;
            font-weight: 500;
            letter-spacing: 2px;
            text-transform: uppercase;
            padding: 25px 45px;
            background: $tab-bg;
            border-radius: 30px;
            line-height: 1;
            color: $tab-color;
            &.active{
                color: $white;
                background: $theme-color;
            }
        }
    }
}
.bakix-details-tab{
    & ul{
        border-bottom: 2px solid #e1e1e1;
        & li{
            & a{
                font-size: 16px;
                font-weight: 500;
                color: #8c8bb5;
                letter-spacing: 2px;
                padding: 0;
                text-transform: capitalize;
                position: relative;
                padding: 0 25px;
                @media #{$xs}{
                    padding: 0 10px;
                }
                &.active{
                    color: #100d1c;
                    &:before{
                        position: absolute;
                        bottom: -32px;
                        left: 0;
                        height: 2px;
                        width: 100%;
                        content: "";
                        background: $theme-color;
                        transition: .3s;
                        @media #{$xs}{
                            display: none;
                        }
                        @media #{$sm}{
                            display: block;
                        }

}
                }

}
        }
    }
}

CANCEL

Acorn | AI, Software Integration & Business Automation

+1 929 494 8462 info@acorntech.us Acorn Technology Solutions

AI, Shopify, Mobile, and Web for business

Build digital experiences that work for your business.

Explore our services

Book a Consultation

We are available+1 929 494 8462

Who we are

Enterprise experience, focused on your business

Founded in 2019 by Sann Win, a former IBM application architect, Acorn Technology Solutions brings experience from startups and major U.S. enterprises. Sann has delivered exceptional software solutions for IBM, American Express, and Chase.

Sann Win, founder of Acorn Technology Solutions

Build, connect, and improve

Acorn helps businesses build digital products and connect the tools they already use. Our services span Shopify storefronts, web and mobile products, and practical AI and automation. We start by understanding your business, agree on a clear scope, and guide delivery through testing and handoff.

Our services

We provide practical services for your business

Build a stronger storefront or digital product, or connect the software your team already relies on. Choose a service to see how we can help.

AI & Automation Services

Connect the systems behind your day-to-day work, with clear handling for bad data, failed steps, and decisions that need a person.

Shopify Development

Build a Shopify storefront where catalog structure, theme behavior, apps, and the shopping journey work together.

Web & Mobile Development

Design and build websites, mobile apps, and platforms around how people find information, complete tasks, and manage content.

Limited-time launch offer

Save $50 on an Automation Audit

For the first five new clients who book a consultation by November 30, 2026. The $50 discount applies to a scoped Automation Audit (regularly $250–$500).

Book a Consultation +1 929 494 8462

Our projects

Selected case studies

Explore a selection of the digital products and platforms Acorn has helped build.

Mobile Development · SaaS Development Civic Curriculum Civic engagement and community management platform.

Web Development The Clios The Clios website brings together award programs, events, and winning creative work. Sann contributed frontend and Internet Explorer support.

Mobile Development Pet Sentry Smart pet monitoring and care application, providing peace of mind for pet owners.

View all case studies

AnthemSilverAward

Award-winning impact

GoalUp earned a Silver Anthem Award

Acorn contributed to the digital learning platform for GoalUp, a financial empowerment program created by DoorDash and the National Urban League.

The program received a Silver Anthem Award for Responsible Technology in the Corporate Social Responsibility category.

View the official award listing

Our blog

Ideas for better digital products and workflows

Practical guidance on Shopify, web development, and business automation.

A conveyor carries business task cards through a robotic automation step while a person reviews the result.

AI & Automation A Practical Way to Choose Your First Business Automation Automation is easiest to justify when it removes a recurring decision or handoff—not simply because a task is repetitive. This guide helps you choose a first workflow with visible value. Read article

A website enquiry card moves through consent and assignment checkpoints into an organized CRM.

AI & Automation A Website-to-CRM Handoff Checklist for Small Teams A website lead can disappear without a single system going offline: the form succeeds, the email arrives, and nobody owns the next step. This checklist traces the handoff from consent and. Read article

Task cards follow a branching workflow map through a human decision point.

AI & Automation How to Map a Business Workflow Before Automating It If a process exists only in one person’s memory, an automation diagram drawn from assumptions is a risk register in disguise. This guide gives you a practical mapping method that captures. Read article

Read all articles

Contact us

Let’s talk about what your business needs.

Choose a time for a 30-minute conversation. Cal.com will show the meeting details before you confirm.

Prefer email? Call +1 929 494 8462 or email info@acorntech.us.

Loading available consultation times…

Open the scheduler in a new tab

Prefer to send a message instead?

Leave your name, email, and a brief note. This inquiry does not reserve a calendar time.