/* drift */
@keyframes drift-fadeZoomIn {
0% {
transform: scale(1.5);
opacity: 0;
}
100% {
transform: scale(1);
opacity: 1;
}
}
@keyframes drift-fadeZoomOut {
0% {
transform: scale(1);
opacity: 1;
}
15% {
transform: scale(1.1);
opacity: 1;
}
100% {
transform: scale(0.5);
opacity: 0;
}
}
@keyframes drift-loader-rotate {
0% {
transform: translate(-50%, -50%) rotate(0);
}
50% {
transform: translate(-50%, -50%) rotate(-180deg);
}
100% {
transform: translate(-50%, -50%) rotate(-360deg);
}
}
@keyframes drift-loader-before {
0% {
transform: scale(1);
}
10% {
transform: scale(1.2) translateX(6px);
}
25% {
transform: scale(1.3) translateX(8px);
}
40% {
transform: scale(1.2) translateX(6px);
}
50% {
transform: scale(1);
}
60% {
transform: scale(0.8) translateX(6px);
}
75% {
transform: scale(0.7) translateX(8px);
}
90% {
transform: scale(0.8) translateX(6px);
}
100% {
transform: scale(1);
}
}
@keyframes drift-loader-after {
0% {
transform: scale(1);
}
10% {
transform: scale(1.2) translateX(-6px);
}
25% {
transform: scale(1.3) translateX(-8px);
}
40% {
transform: scale(1.2) translateX(-6px);
}
50% {
transform: scale(1);
}
60% {
transform: scale(0.8) translateX(-6px);
}
75% {
transform: scale(0.7) translateX(-8px);
}
90% {
transform: scale(0.8) translateX(-6px);
}
100% {
transform: scale(1);
}
}
@-webkit-keyframes drift-fadeZoomIn {
0% {
-webkit-transform: scale(1.5);
opacity: 0;
}
100% {
-webkit-transform: scale(1);
opacity: 1;
}
}
@-webkit-keyframes drift-fadeZoomOut {
0% {
-webkit-transform: scale(1);
opacity: 1;
}
15% {
-webkit-transform: scale(1.1);
opacity: 1;
}
100% {
-webkit-transform: scale(0.5);
opacity: 0;
}
}
@-webkit-keyframes drift-loader-rotate {
0% {
-webkit-transform: translate(-50%, -50%) rotate(0);
}
50% {
-webkit-transform: translate(-50%, -50%) rotate(-180deg);
}
100% {
-webkit-transform: translate(-50%, -50%) rotate(-360deg);
}
}
@-webkit-keyframes drift-loader-before {
0% {
-webkit-transform: scale(1);
}
10% {
-webkit-transform: scale(1.2) translateX(6px);
}
25% {
-webkit-transform: scale(1.3) translateX(8px);
}
40% {
-webkit-transform: scale(1.2) translateX(6px);
}
50% {
-webkit-transform: scale(1);
}
60% {
-webkit-transform: scale(0.8) translateX(6px);
}
75% {
-webkit-transform: scale(0.7) translateX(8px);
}
90% {
-webkit-transform: scale(0.8) translateX(6px);
}
100% {
-webkit-transform: scale(1);
}
}
@-webkit-keyframes drift-loader-after {
0% {
-webkit-transform: scale(1);
}
10% {
-webkit-transform: scale(1.2) translateX(-6px);
}
25% {
-webkit-transform: scale(1.3) translateX(-8px);
}
40% {
-webkit-transform: scale(1.2) translateX(-6px);
}
50% {
-webkit-transform: scale(1);
}
60% {
-webkit-transform: scale(0.8) translateX(-6px);
}
75% {
-webkit-transform: scale(0.7) translateX(-8px);
}
90% {
-webkit-transform: scale(0.8) translateX(-6px);
}
100% {
-webkit-transform: scale(1);
}
}
.fade-inFS {
opacity: 0;
transform: translateY(-10px);
transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
}
.fade-inFS.show {
opacity: 1;
transform: translateY(0);
}
.add-to-cart-new:hover{
background-color: unset !important;
border: unset !important;
padding: 0px !important;
}
button.add-to-cart-new {
background-color: unset !important;
border: unset !important;
padding: 0px !important;
}
button.add-to-cart-new3 {
background-color: unset !important;
border: unset !important;
padding: 0px !important;
}
button.add-to-cart-new :hover img {
content: url('https://sbmedia3.sbdesignsquare.com/sbds/images/custom/add-to-cart-hover.png'); /* URL of the hover image */
}
.spinner-wrapper {
display: flex;
justify-content: center;
align-items: center;
height: 100vh; /* ครอบคลุมทั้งหน้าจอ */
position: fixed;
top: 0;
left: 0;
width: 100%;
background-color: rgba(255, 255, 255, 0.8); /* สีพื้นหลังที่โปร่งใส */
z-index: 9999; /* ให้ spinner อยู่บนสุด */
}
.spinner {
animation: rotator 1.4s linear infinite;
}
@keyframes rotator {
0% { transform: rotate(0deg); }
100% { transform: rotate(270deg); }
}
.path {
stroke-dasharray: 187;
stroke-dashoffset: 0;
transform-origin: center;
animation:
dash 1.4s ease-in-out infinite,
colors 5.6s ease-in-out infinite;
}
@keyframes dash {
0% { stroke-dashoffset: 187; }
50% {
stroke-dashoffset: 46.75;
transform:rotate(135deg);
}
100% {
stroke-dashoffset: 187;
transform:rotate(450deg);
}
}
@keyframes colors {
0% { stroke: #4285F4; }
25% { stroke: #DE3E35; }
50% { stroke: #F7C223; }
75% { stroke: #1B9A59; }
100% { stroke: #4285F4; }
}
#maincontent > div.columns > div > div.main-content-media > div.product-info-main > div.product-social-links > div.product-sharing-buttons {
display: none !important;
}
.report-port.filters {
/* display: flex;
justify-content: space-between;
align-items: center; */
padding: 20px;
max-width: 1450px;
margin-left: auto;
margin-right: auto;
}
.report-port.filters.inner {
display: flex;
justify-content: space-between;
flex-wrap: nowrap; /* ป้องกันการขึ้นบรรทัดใหม่ */
gap: 10px; /* เพิ่มช่องว่างระหว่าง Filter */
}
.filter-group {
display: flex;
gap: 10px;
align-items: center;
flex-wrap: nowrap; /* ป้องกันการขึ้นบรรทัดใหม่ */
}
.search-group {
display: flex;
justify-content: flex-end;
align-items: center;
}
.report-port.filter-dropdown, .report-port.search-input {
padding: 10px;
border: 1px solid #ccc;
border-radius: 5px;
font-size: 16px;
}
.report-port.filter-dropdown {
width: 200px;
height: 40px;
position: relative;
z-index: 10; /* บังคับให้อยู่เหนือ element อื่นๆ */
}
.report-port.search-input {
width: 260px;
height: 40px;
}
/* Keeping the rest of your CSS unchanged */
.report-port.pagination {
display: flex;
justify-content: center;
margin-top: 20px;
}
.report-port.page-button {
padding: 8px 16px;
margin: 0 5px;
/* border: 1px solid #ccc;
background-color: #f0f0f0; */
border: 1px solid #ccc;
background-color: #f0f0f0;
color: black;
cursor: pointer;
border-radius: 5px;
}
.report-port.page-button.active {
background-color: #24b4cc;
color: #fff;
}
.report-port.page-button:hover {
background-color: #24b4cc;
color: #fff;
}
.report-port .page-dots {
padding: 8px 16px;
margin: 0 5px;
}
.report-port.product-grid {
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: 20px;
padding: 20px;
max-width: 1450px;
margin-left: auto;
margin-right: auto;
}
.report-port .product-card {
border: 1px solid #e0e0e0;
border-radius: 5px;
padding: 10px;
box-shadow: 0 2px 5px rgba(0,0,0,0.1);
display: flex;
flex-direction: column;
/* justify-content: space-between; */
justify-content: flex-start;
min-height: 350px;
}
.report-port .product-image {
width: 100%;
height: 250px;
object-fit: cover;
border-radius: 5px;
}
.report-port .product-title {
font-weight: bold;
margin-top: 10px;
min-height: 40px; /* ปรับตามความสูงของบรรทัด */
display: block;
overflow: hidden;
text-overflow: ellipsis; /* สำหรับสินค้าที่มีชื่อยาวมาก จะขึ้น ... */
white-space: normal; /* ให้ชื่อขึ้นบรรทัดใหม่หากชื่อยาวเกิน */
}
.report-port .product-price {
font-weight: bold;
color: #e44d26;
/* margin-top: 5px; */
float: right;
}
/* .report-port .product-port {
margin-left: auto;
text-align: right;
font-size: 14px;
} */
.report-port .product-info-row {
display: flex;
justify-content: space-between; /* ให้ Stock อยู่ฝั่งซ้าย และ Port อยู่ฝั่งขวา */
width: 100%;
}
.report-port .product-brand::before {
/* font-weight: 600; Bold the "Brand:" text */
content: "Brand: ";
}
.report-port.product-brand{
/* font-weight: 500;*/
}
.report-port.product-size{
/* font-weight: 500;*/
}
.report-port .product-size::before {
/* font-weight: 600; /* Bold the "Port:" text */
content: "Size: ";
}
.report-port .product-stock::before {
/* font-weight: 600; /* Bold the "Stock:" text */
content: "Stock: ";
}
.report-port .product-stock {
text-align: left;
/* font-weight: 500;*/
}
.report-port .product-port {
margin-right : auto;
text-align: left;
font-size: 14px;
/* font-weight: 500;*/
}
.report-port .product-port::before {
/* font-weight: 600; /* Bold the "Port:" text */
content: "Port: ";
}
.report-port .product-type::before {
/*font-weight: 600; /* Bold the "Port:" text */
content: "Type: ";
}
.report-port .product-type{
/*font-weight: 500; */
display: none;
}
.video-filter-btn {
display: flex;
align-items: center;
padding: 8px 12px;
background: #f0f0f0;
border: 1px solid #ddd;
border-radius: 4px;
cursor: pointer;
transition: all 0.3s ease;
}
.video-filter-btn.active {
background: #007bff;
color: white;
border-color: #0056b3;
}
.video-icon-filter {
display: inline-block;
width: 20px;
height: 20px;
background: url('data:image/svg+xml;utf8,') no-repeat center;
margin-right: 5px;
}
.video-filter-btn.active .video-icon-filter {
background: url('data:image/svg+xml;utf8,') no-repeat center;
}
.main-slider-port {
height: auto; /* ลดความสูงของภาพหลัก */
display: flex;
justify-content: center;
}
.main-slider-port img {
width: 100%;
height: 100%;
object-fit: cover; /* หรือใช้ contain ถ้าต้องการให้ภาพไม่ถูกตัด */
}
#main-slider-port .slick-arrow {
background: none; /* เอาฉากหลัง (background) ออก */
border: none; /* เอาขอบ (border) ออก */
box-shadow: none; /* เอาเงาออก */
}
#thumbnail-slider-port .slick-arrow {
background: none; /* เอาฉากหลัง (background) ออก */
border: none; /* เอาขอบ (border) ออก */
box-shadow: none; /* เอาเงาออก */
}
.thumbnail-slider-port {
width: 100%;
/* max-width: 700px; */
height: 20%;
margin: 0 auto; /* เอา margin ออกเพื่อให้ชิดซ้าย */
}
.thumbnail-slider-port .slick-track {
margin-left: 10%;
}
.thumbnail-slider-port img {
height: 80px; /* กำหนดความสูงของรูป thumbnail */
object-fit: cover;
}
.thumbnail-slider-port .slick-slide img {
border: none; /* ไม่มีขอบสำหรับภาพที่ยังไม่ได้ดู */
}
.thumbnail-slider-port .slick-slide.slick-current img {
border: 3px solid #ADD8E6; /* ขอบสีฟ้าอ่อนสำหรับภาพที่กำลังดูอยู่ */
}
.image-container {
position: relative;
}
/* ปรับให้ video-icon อยู่ในตำแหน่งล่างขวาของ product-card */
.report-port.product-card {
position: relative; /* ใช้ relative เพื่อให้ absolute ทำงานได้ */
transition: box-shadow 0.3s ease-in-out, transform 0.3s ease-in-out;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
border-radius: 10px;
}
.video-icon {
position: absolute;
bottom: 10px; /* ตำแหน่งจากล่าง */
right: 10px; /* ตำแหน่งจากขวา */
width: 24px; /* ขนาดของ icon */
height: 24px; /* ขนาดของ icon */
background-image: url('img/play_video_icon.png'); /* ใส่ลิงก์ภาพหรือไอคอนที่คุณต้องการใช้ */
background-size: cover;
background-repeat: no-repeat;
pointer-events: none; /* ป้องกันการคลิกหรือ hover บนไอคอน */
}
/* ป้องกันการทับของเนื้อหาภายใน product-card */
.report-port.product-info-row {
position: relative;
z-index: 1; /* กำหนดให้เนื้อหาอยู่ต่ำกว่าไอคอน */
}
/* ปรับการแสดงสินค้าเริ่มต้น */
.report-port .product-card {
transition: box-shadow 0.3s ease-in-out, transform 0.3s ease-in-out;
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); /* เพิ่มเงาเล็กๆ */
border-radius: 10px;
}
/* เมื่อ hover สินค้า */
.report-port .product-card:hover {
box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.2); /* เพิ่มเงาที่ชัดเจนขึ้น */
transform: scale(1.02); /* ขยายสินค้าเล็กน้อย */
}
.report-port.export-button {
padding: 10px 20px;
margin: 10px;
background-color: #24b4cc;
color: #fff;
border: none;
border-radius: 5px;
cursor: pointer;
}
.report-port.export-button:hover {
background-color: #1a8da3;
}
.product-info-main .product-info-price .product-info-stock-sku .product-info-delivery-time .product-delivery-time#KC {
line-height: 1.2 !important;
}
.add-to-cart-new.unique-add-to-cart-buttonL_Desktop{
background-color: unset;
border: unset;
padding: 0px;
}
.add-to-cart-new.unique-add-to-cart-buttonL_Desktop:hover img {
content: url('https://sbmedia3.sbdesignsquare.com/sbds/images/freeshipping/icon_cart_kc_new_hover.png'); /* URL of the hover image */
}
/* สไตล์พื้นฐานสำหรับทุกขนาดหน้าจอ */
.free-shipping-tag {
background-color: #00a652;
color: white;
padding: 2px 0px 2px 0px;
display: inline-flex;
/* align-items: flex-end; */
align-items: center;
justify-content: center;
border-radius: 0px;
font-size: 1.2rem;
width: 6em;
height: 2em;
}
#sbdesignsquareDomain.free-shipping-tag{
background-color: #24b4cc;
}
.iconfreeshipping {
width: 1.8em;
margin-right: 6px;
}
.div-free-shipping-image {
display: flex;
align-items: center;
padding-left: 0px;
padding-top: 5px;
}
.product-info-main .product-info-price .product-info-stock-sku .div-tookshur-shipping-image#SB_Prd{
font-size: 1em;
height: 2rem;
display: flex;
margin-top: 2px;
align-items: center;
}
.product-info-main .product-info-price .product-info-stock-sku .div-free-shipping-image#SB_Prd{
font-size: 1em;
height: 2rem;
display: flex;
margin-top: 2px;
align-items: center;
}
.product-info-main .product-info-price .product-info-stock-sku .div-free-shipping-image .free-shipping-tag#SB_Prd{
color: #24b4cc;
margin-left: 7px;
margin-right: 7px;
}
.product-info-main .product-info-price .product-info-stock-sku .div-tookshur-shipping-image .tookshur-shipping-tag#SB_Prd{
margin-left: 7px;
}
/* Specific styles for the main product page when sku matches */
.product-info-main .product-info-price .product-info-stock-sku .div-free-shipping-image .tookshur-shipping-tag .iconfreeshipping,
.main-content-media .product.media .product-reviews-summary .rating-summary .div-free-shipping-image .tookshur-shipping-tag .iconfreeshipping,
.main-content-media .product.media .page-title-wrapper.product.show-sp .size-label .div-free-shipping-image .tookshur-shipping-tag .iconfreeshipping
{
width: 2em;
margin-right: 5px;
}
.product-info-main .product-info-price .product-info-stock-sku .div-free-shipping-image .tookshur-shipping-tag,
.product-info-main .product-info-price .product-info-stock-sku .div-tookshur-shipping-image .tookshur-shipping-tag,
.main-content-media .product.media .product-reviews-summary .rating-summary .div-free-shipping-image .tookshur-shipping-tag,
.main-content-media .product.media .product-reviews-summary .rating-summary .div-tookshur-shipping-image .tookshur-shipping-tag,
.main-content-media .product.media .page-title-wrapper.product.show-sp .size-label .div-free-shipping-image .tookshur-shipping-tag,
.main-content-media .product.media .page-title-wrapper.product.show-sp .size-label .div-tookshur-shipping-image .tookshur-shipping-tag {
/* font-size:1.2rem !important; */
width: 7em !important;
/* แก้ตั้งแต่ตรงนี้ ล่าสุด*/
font-size:1.5rem !important;
background-color: unset;
color: #ff6600;
justify-content: flex-start;
font-weight: 500;
padding-left: 4px;
}
.product-info-main .product-info-price .product-info-stock-sku .div-free-shipping-image .free-shipping-tag,
.product-info-main .product-info-price .product-info-stock-sku .div-tookshur-shipping-image .free-shipping-tag,
.main-content-media .product.media .product-reviews-summary .rating-summary .div-free-shipping-image .free-shipping-tag,
.main-content-media .product.media .product-reviews-summary .rating-summary .div-tookshur-shipping-image .free-shipping-tag,
.main-content-media .product.media .page-title-wrapper.product.show-sp .size-label .div-free-shipping-image .free-shipping-tag,
.main-content-media .product.media .page-title-wrapper.product.show-sp .size-label .div-tookshur-shipping-image .free-shipping-tag {
/* font-size:1.2rem !important; */
font-size: 1.4rem ;
font-weight: 500;
width: 5em !important;
/* แก้ตั้งแต่ตรงนี้ ล่าสุด*/
background-color: unset;
color: #31b63f;
}
.product-info-main .product-info-price .product-info-stock-sku .div-free-shipping-image,
.product-info-main .product-info-price .product-info-stock-sku .div-tookshur-shipping-image,
.main-content-media .product.media .product-reviews-summary .rating-summary .div-free-shipping-image,
.main-content-media .product.media .product-reviews-summary .rating-summary .div-tookshur-shipping-image,
.main-content-media .product.media .page-title-wrapper.product.show-sp .size-label .div-free-shipping-image,
.main-content-media .product.media .page-title-wrapper.product.show-sp .size-label .div-tookshur-shipping-image {
padding-left: 10px;
border-left: none;
margin-left: 7px;
display: inline-block;
padding-top: 0;
border-left: 2px solid #bbb;
height: 1.1em;
margin-top: 2px;
display: flex;
/* แก้ตั้งแต่ตรงนี้ ล่าสุด*/
padding-left: 0px;
}
.tookshur-shipping-tag {
background-color: #ff9600;
color: white;
padding: 2px 0px 2px 0px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 0px;
font-size: 1.2rem; /* ปรับขนาดตัวอักษรให้เล็กลง */
width: 7.5em; /* ปรับความกว้างของปุ่ม */
height: 2em; /* ปรับความสูงของปุ่ม */
}
#sbdesignsquareDomain.tookshur-shipping-tag{
background-color: #ff9600;
}
.icontookshurshipping {
width: 1.8em;
margin-right: 7px;
}
.div-tookshur-shipping-image {
display: flex;
align-items: center;
padding-left: 0px;
padding-top: 5px;
}
#sbdesignsquareDomain.div-tookshur-shipping-image {
margin-bottom: 0px;
padding-bottom: 5px;
}
#sbdesignsquareDomain.div-free-shipping-image {
margin-bottom: 0px;
padding-bottom: 5px;
}
/* สไตล์สำหรับมือถือ (ขนาดหน้าจอเล็กกว่า 768px) */
@media (max-width: 768px) {
.product-info-main .product-info-price .product-info-stock-sku .product-info-delivery-time .product-delivery-time{
border-left: unset;
}
.grand.totals .amount{
border-top: unset !important;
}
.total-rules .mark {
font-size: 14px !important;
}
.product-info-main .product-info-price .product-info-stock-sku .div-free-shipping-image .free-shipping-tag#SB_Prd{
font-size: 1.2rem; /* ปรับขนาดตัวอักษรให้เล็กลง */
margin-left: 0px;
}
.product-info-main .product-info-price .product-info-stock-sku .div-tookshur-shipping-image .tookshur-shipping-tag#SB_Prd{
margin-left: 0px;
}
/* Specific styles for the main product page when sku matches */
.product-info-main .product-info-price .product-info-stock-sku .div-free-shipping-image,
.product-info-main .product-info-price .product-info-stock-sku .div-tookshur-shipping-image,
.main-content-media .product.media .product-reviews-summary .rating-summary .div-free-shipping-image,
.main-content-media .product.media .product-reviews-summary .rating-summary .div-tookshur-shipping-image,
.main-content-media .product.media .page-title-wrapper.product.show-sp .size-label .div-free-shipping-image,
.main-content-media .product.media .page-title-wrapper.product.show-sp .size-label .div-tookshur-shipping-image {
padding-left: 0px;
border-left: none;
margin-left: 4px;
display: inline-flex;
padding-top: 0;
border-left: 2px solid #bbb;
}
.iconfreeshipping {
width: 1.8rem; /* ปรับขนาดไอคอนให้เล็กลง */
}
.div-free-shipping-image {
/* padding-top: 0px; ปรับระยะห่างด้านบน */
}
#sbdesignsquareDomain.div-tookshur-shipping-image {
margin-bottom: 0px;
padding-bottom: 0px;
}
#sbdesignsquareDomain.div-free-shipping-image {
margin-bottom: 0px;
padding-bottom: 0px;
}
.icontookshurshipping {
width: 2em; /* ปรับขนาดไอคอนให้เล็กลง */
}
.div-tookshur-shipping-image {
padding-top: 0px; /* ปรับระยะห่างด้านบน */
}
}
/* สำหรับมือถือหน้าจอแคบมาก (320px และต่ำกว่า) */
@media screen and (max-width: 360px) {
.free-shipping-tag {
width: 14em; /* ลดลงให้เหมาะกับหน้าจอแคบมาก */
font-size: 0.75rem;
padding: 2px 4px;
}
.tookshur-shipping-tag {
font-size: 0.9rem;
width: 16em;
height: 2em;
align-items: center;
}
.product-dimensions{
white-space: nowrap;
}
}
/* สำหรับมือถือทั่วไป */
@media (min-width: 361px) and (max-width: 768px) {
.free-shipping-tag {
font-size: 0.9rem;
width: 8rem;
height: 2em;
align-items: center;
}
.tookshur-shipping-tag {
font-size: 0.9rem;
width: 8rem;
height: 2em;
align-items: center;
}
.product-dimensions{
white-space: nowrap;
}
}
@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) , print {
#unique-add-to-cart-button.add-to-cart-new {
right: 25px !important; /* ปรับตำแหน่งด้านขวา */
bottom: 12px !important; /* ปรับตำแหน่งด้านล่าง */
}
#unique-add-to-cart-buttonL.add-to-cart-new {
right: 30px !important; /* ปรับตำแหน่งด้านขวา */
bottom: 12px !important; /* ปรับตำแหน่งด้านล่าง */
}
.page-layout-1column .block.widget .products-grid .product-item {
width: calc((101% - 3%) / 3) !important;
padding: 0 0px;
position: relative;
}
}
/* สไตล์สำหรับแท็บเล็ต (ขนาดหน้าจอระหว่าง 768px ถึง 1024px) */
@media (min-width: 768px) and (max-width: 1024px) {
.free-shipping-tag {
font-size: 1rem; /* ปรับขนาดตัวอักษรให้เล็กลง */
width: 7em; /* ปรับความกว้างของปุ่ม */
height: 2em; /* ปรับความสูงของปุ่ม */
}
.iconfreeshipping {
width: 2rem; /* ปรับขนาดไอคอนให้เล็กลง */
}
.tookshur-shipping-tag {
font-size: 1.6em;
width: 9em;
height: 2.3em;
}
.icontookshurshipping {
width: 2em; /* ปรับขนาดไอคอนให้เล็กลง */
}
}
/* .free-shipping-tag {
background-color: #d82b2b;
color: white;
padding: 0px;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 0px;
font-size: 18px;
/* width: 100px; */
/* height: 1.5em;
}
*/
/* .iconfreeshipping {
width: 2.8rem;
margin-right: 10px;
}
*/
/* #imageTook{
height: 65%;
} */
.drift-zoom-pane {
background: rgba(0, 0, 0, 0.5);
/* This is required because of a bug that causes border-radius to not
work with child elements in certain cases. */
transform: translate3d(0, 0, 0);
-webkit-transform: translate3d(0, 0, 0);
}
.drift-zoom-pane.drift-opening {
animation: drift-fadeZoomIn 180ms ease-out;
-webkit-animation: drift-fadeZoomIn 180ms ease-out;
}
.drift-zoom-pane.drift-closing {
animation: drift-fadeZoomOut 210ms ease-in;
-webkit-animation: drift-fadeZoomOut 210ms ease-in;
}
.drift-zoom-pane.drift-inline {
position: absolute;
width: 150px;
height: 150px;
border-radius: 75px;
box-shadow: 0 6px 18px rgba(0, 0, 0, 0.3);
}
.drift-loading .drift-zoom-pane-loader {
display: block;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
-webkit-transform: translate(-50%, -50%);
width: 66px;
height: 20px;
animation: drift-loader-rotate 1800ms infinite linear;
-webkit-animation: drift-loader-rotate 1800ms infinite linear;
}
.drift-zoom-pane-loader:before,
.drift-zoom-pane-loader:after {
content: "";
display: block;
width: 20px;
height: 20px;
position: absolute;
top: 50%;
margin-top: -10px;
border-radius: 20px;
background: rgba(255, 255, 255, 0.9);
}
.drift-zoom-pane-loader:before {
left: 0;
animation: drift-loader-before 1800ms infinite linear;
-webkit-animation: drift-loader-before 1800ms infinite linear;
}
.drift-zoom-pane-loader:after {
right: 0;
animation: drift-loader-after 1800ms infinite linear;
-webkit-animation: drift-loader-after 1800ms infinite linear;
animation-delay: -900ms;
-webkit-animation-delay: -900ms;
}
.drift-bounding-box {
background-color: rgba(0, 0, 0, 0.4);
}
/* Slider */
.sbsiderTagAll{
cursor: pointer;
}
.slick-slider
{
position: relative;
display: block;
box-sizing: border-box;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-touch-callout: none;
-khtml-user-select: none;
-ms-touch-action: pan-y;
touch-action: pan-y;
-webkit-tap-highlight-color: transparent;
}
.slick-list
{
position: relative;
display: block;
overflow: hidden;
margin: 0;
padding: 0;
}
.slick-list:focus
{
outline: none;
}
.slick-list.dragging
{
cursor: pointer;
cursor: hand;
}
.slick-slider .slick-track,
.slick-slider .slick-list
{
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.slick-track
{
position: relative;
top: 0;
left: 0;
display: block;
margin-left: auto;
margin-right: auto;
}
.slick-track:before,
.slick-track:after
{
display: table;
content: '';
}
.slick-track:after
{
clear: both;
}
.slick-loading .slick-track
{
visibility: hidden;
}
.slick-slide
{
display: none;
float: left;
height: 100%;
min-height: 1px;
}
[dir='rtl'] .slick-slide
{
float: right;
}
.slick-slide img
{
display: block;
}
.slick-slide.slick-loading img
{
display: none;
}
.slick-slide.dragging img
{
pointer-events: none;
}
.slick-initialized .slick-slide
{
display: block;
}
.slick-loading .slick-slide
{
visibility: hidden;
}
.slick-vertical .slick-slide
{
display: block;
height: auto;
border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
display: none;
}
.product-image-container-10732 {
width: 240px;
}
.product-image-container-10732 span.product-image-wrapper {
padding-bottom: 125%;
}
/*.product-item-info:hover {
box-shadow: 1px 0px 4px 1px rgb(0 0 0 / 30%);
border: 2px solid #24b4cc;
}*/
/* .main-content-media .product-info-main .product-reviews-summary .reviews-actions a.action.add{
background: #54534A;
border: 1px solid #54534A;
} */
@media only screen and (max-width: 767px) {
/* kcplay */
.block.product-list-bt.custom-carousel.custom-carousel-kcplay .block-content.content li.item.product.product-item .product.details.product-item-details .div-free-shipping-image {
padding-top: 10px;
}
.block.product-list-bt.custom-carousel.custom-carousel-kcplay .block-content.content li.item.product.product-item .product.details.product-item-details .div-tookshur-shipping-image {
padding-top: 10px;
}
.block.product-list-bt.custom-carousel.custom-carousel-kcplay .block-content.content li.item.product.product-item .product.details.product-item-details{
height: 11rem;
}
/* disney */
.block.product-list-bt.custom-carousel.custom-carousel-disney #sbdesignsquareDomain.div-free-shipping-image{
padding-bottom: 10px;
}
.block.product-list-bt.custom-carousel.custom-carousel-disney .block-content.content li.item.product.product-item .product.details.product-item-details .div-free-shipping-image{
padding-top: 25px;
}
.block.product-list-bt.custom-carousel.custom-carousel-disney .block-content.content li.item.product.product-item .product.details.product-item-details{
height: 13rem;
}
.block.product-list-bt.custom-carousel.custom-carousel-disney .block-content.content strong.product.name.product-item-name{
min-height: 2.5em;
}
/* .block.product-list-bt.custom-carousel.custom-carousel-disney .price-final_price{
line-height: 2.8;
} */
.block.widget.block-products-list.grid .old-price{
margin-bottom: -2px !important;
}
.block.widget .products-grid .product-item .product-item-info .product-item-details .price-box{
text-align: left !important;
}
.product-item-details .special-price,.product-item-details .old-price{
display: inline-block !important;
}
.product-kcplay .old-price{
display: none !important;
}
.product-kcplay .product-item-size{
display: none !important;
}
.product-kcplay .add-to-cart-new{
display: block !important;
bottom: 9px;
}
.products-related .product-item-link{
font-size: 14px !important;
}
.products-related .special-price {
margin-top: 6px !important;
}
.products-related .product-item .special-price .price {
font-size: 1.4rem !important;
}
.products-related .discount-percent{
font-size: 1rem;
}
.product-item .price-box .price[data-price-type="oldPrice"] {
font-size: 10px !important;
}
/* .product-item-link.sbsiderTagCross{
min-height: 3.4em !important;
font-size: 14px !important;
} */
.product-item-link.sbsiderTagCross{
min-height: 4em !important;
font-size: 14px !important;
}
.product-kcplay .product-item-link {
font-size: 1.2rem !important;
}
.product-kcplay .product-item-name{
margin-bottom: -14px !important;
}
.catalog-product-view .products-grid .product-items .product-item{
padding: 1px 3px !important;
}
.product-item-name{
margin-top: 5px !important;
margin-bottom: -3px !important;
}
.size-label {
font-size: 1.1rem !important;
}
/* .product-item .special-price .price {
font-size: 1.5rem !important;
} */
.price-final_price .old-price .discount-percent {
padding-left: 0.45em !important;
/*font-size: 1.2rem !important;*/
}
.price-final_price .old-price {
/*font-size: 1.2rem !important;*/
margin-top: 2px;
margin-bottom: 2px;
/*white-space: nowrap !important;*/
}
.sbSider-slick.slick-initialized.slick-slider {
padding: 0 0px 0px !important;
}
.sbSiderTitle strong{
font-size: 2.2rem !important;
}
.sbSiderTitle-recommend strong{
font-size: 2.2rem !important;
}
/* .item.product.product-item .product-item-info{
padding: 10px !important;
} */
#old-price-10732 .price{
font-size: 1.0em !important;
}
.price-container.price-final_price.tax.weee .price-label{
/*font-size: 1.2rem !important;*/
}
.div-free-shipping-image {
padding-bottom: 10px;
}
.closeSbSiderPopup{
right: 22% !important;
}
}
img.productLabels:not([src*="delivery"]):not([src="https://media.sbdesignsquare.com/media/mplabel/label/Icon_ReturnForBetter2025_1.png"]){
height: 13% !important;
}
.sale-only-btn{
display: none !important;
}
.closeSbSiderPopup{
right: 20% !important;
}
.sbSiderTitle strong:before{
content: "";
background: #000;
display: inline-block;
width: 31px;
height: 2px;
vertical-align: middle;
margin-right: 10px;
margin-left: 10px;
}
.sbSiderTitle strong:after{
content: "";
background: #000;
display: inline-block;
width: 31px;
height: 2px;
vertical-align: middle;
margin-right: 10px;
margin-left: 10px;
}
.sbSiderTitle-recommend strong:before{
content: "";
background: #000;
display: inline-block;
width: 31px;
height: 2px;
vertical-align: middle;
margin-right: 10px;
margin-left: 10px;
}
.sbSiderTitle-recommend strong:after{
content: "";
background: #000;
display: inline-block;
width: 31px;
height: 2px;
vertical-align: middle;
margin-right: 10px;
margin-left: 10px;
}
.sbSiderTitle-recommend-bestSeller strong:before{
content: "";
background: #000;
display: inline-block;
width: 31px;
height: 2px;
vertical-align: middle;
margin-right: 10px;
margin-left: 10px;
}
.sbSiderTitle-recommend-bestSeller strong:after{
content: "";
background: #000;
display: inline-block;
width: 31px;
height: 2px;
vertical-align: middle;
margin-right: 10px;
margin-left: 10px;
}
.product-item-details a:hover{
color: #272727;
text-decoration: underline;
}
.product-item-details .sbsiderTag:hover{
color: #272727;
text-decoration: underline;
}
.privatesale-event-container .privatesale-countdown-timer:before, .catalog-product-view .header-one .privatesale-countdown-
timer:before {
width: 41px !important;
height: 41px !important;
background-size: 41px 41px !important;
background-image: url
(https://www.sbdesignsquare.com/static/version1649216841/frontend/Isobar/sb/th_TH/Plumrocket_PrivateSale/images/timer.svg)
!important;
align-items: center;
justify-content: center;
text-align: center;
display: block;
}
.catalog-product-view .products-grid .product-items .product-item.product-item-sbsider {
width: calc((100% - 6%)/4);
}
.privatesale-event-container .sb-sider-private-countdown:before{
margin-left: 43%;
}
.sbSiderTitle{
position: relative;
width: 100%;
margin-top: 0%;
left: 0%;
}
.sbSiderTitle-recommend-bestSeller{
position: absolute;
width: 100%;
margin-top: -2%;
left: 69%;
}
.sbSiderTitle-recommend{
position: relative;
width: auto;
margin-top: 0%;
text-align: center;
}
.mainTopSmart{
margin-bottom: 30px;
padding-bottom: 15px;
margin-top: 0px !important;
margin-left: 0px;
margin-right: 0px;
}
.mainTopSmart-bestSeller{
border: solid 4px #c3c2c2;
border-radius: 49px;
margin-bottom: 30px;
padding-bottom: 15px;
margin-top: 30px;
}
@media screen and (min-width: 768px) {
.product-info-main .product-info-price .product-info-stock-sku .product-info-delivery-time .product-delivery-time {
padding-left: 10px !important;
}
.product-info-main .product-info-price .product-info-stock-sku .product-info-delivery-time#SB .product-delivery-time{
line-height: 1;
}
.product-info-main .product-info-price .product-info-stock-sku .product-info-delivery-time#SB{
font-size: 18px;
}
.product-info-main .product-info-price .product-info-stock-sku .stock.available#SB{
font-size: 18px;
}
/* .catalog-product-view .products-grid .product-items .product-item{
padding: 1px 2px !important;
} */
}
@media only screen and (max-width: 767px) {
.product-info-main .product-info-price .product-info-stock-sku .product-info-delivery-time .product-delivery-time {
line-height: 1.5 !important;
}
.product-info-main .product-info-price .product-info-stock-sku .product-info-delivery-time .product-delivery-time {
padding-left: 5px !important;
}
/* .catalog-product-view .block-viewed-products-grid:not(.products-related) .product-items .product-item .product-item-info, .review-product-list .block-viewed-products-grid:not(.products-related) .product-items .product-item .product-item-info{
height: 42rem !important;
}
.catalog-product-view .products-grid:not(.products-related) .product-items .product-item .product-item-info:hover, .review-product-list .products-grid:not(.products-related) .product-items .product-item .product-item-info:hover, .catalog-product-view .block-viewed-products-grid:not(.products-related) .product-items .product-item .product-item-info:hover, .review-product-list .block-viewed-products-grid:not(.products-related) .product-items .product-item .product-item-info{
height: 42rem !important;
} */
}
/*Tablet Query*/
@media only screen and (min-width: 481px) and (max-width:768px) {
.sbSiderTitle{
position: relative;
width: 100%;
margin-top: 0%;
left: 0%;
}
.sbSiderTitle-recommend{
position: absolute;
width: 100%;
margin-top: 0%;
left: 56%;
}
.sbSiderTitle-recommend-bestSeller{
position: absolute;
width: 100%;
margin-top: -3%;
left: 57%;
}
.mainTopSmart-bestSeller{
border: solid 4px #c3c2c2;
border-radius: 49px;
margin-bottom: 30px;
padding-bottom: 15px;
margin-top: 30px;
}
.mainTopSmart{
margin-bottom: 30px;
padding-bottom: 15px;
margin-top: 30px;
margin-left: 70px;
margin-right: 70px;
}
}
/*Mobile Query*/
@media only screen and (max-width:480px) {
.sbSiderTitle{
position: relative;
width: 100%;
margin-top: 0%;
left: 0%;
}
.sbSiderTitle-recommend{
width: auto;
margin-top: 0%;
position: relative;
text-align: center;
}
.sbSiderTitle-recommend-bestSeller{
position: absolute;
width: auto;
margin-top: -7%;
left: 10%;
}
.mainTopSmart-bestSeller{
border: solid 4px #c3c2c2;
border-radius: 49px;
margin-bottom: 30px;
padding-bottom: 15px;
margin-top: 30px;
}
.mainTopSmart{
margin-bottom: 30px;
padding-bottom: 15px;
margin-top: 30px;
margin-left: 10px;
margin-right: 10px;
}
}
@media only screen and (min-width: 600px) {
.stock.available#KC span {
font-size: 15px !important; /* หรือขนาดอื่นที่ต้องการ */
/* เพิ่มสไตล์อื่น ๆ ที่ต้องการ เช่นสี ตัวหนา */
}
.product-info-delivery-time span#KC {
font-size: 15px !important; /* หรือขนาดอื่นที่ต้องการ */
/* เพิ่มสไตล์อื่น ๆ ที่ต้องการ เช่นสี ตัวหนา */
}
.privatesale-event-container .privatesale-countdown-timer:before, .catalog-product-view .header-one .privatesale-countdown-
timer:before {
width: 41px !important;
height: 41px !important;
background-size: 41px 41px !important;
background-image: url
(https://www.sbdesignsquare.com/static/version1649216841/frontend/Isobar/sb/th_TH/Plumrocket_PrivateSale/images/timer.svg)
!important;
align-items: center;
justify-content: center;
text-align: center;
display: block;
}
.catalog-product-view .products-grid .product-items .product-item.product-item-sbsider {
width: calc((100% - 6%)/4);
}
.privatesale-event-container .sb-sider-private-countdown:before{
margin-left: 43%;
}
}
/* .product-info-main .product-info-dimensions .product-dimensions{
font-size: 2.5rem;
} */
/* @media only screen and (min-width:1080px) {
.product-info-main .product-info-price{
display: flex;
flex-wrap: wrap;
align-items: center;
gap: 10px;
}
.product-info-main .product-info-price .price-final_price{
flex:1;
}
.ins-content-wrapper-1112{
flex:1;
}
.align-flex-css-headImage{
align-items: center;
display: flex;
position: relative;
justify-content: center;
flex-direction: column;
}
} */
img[src="https://image.useinsider.com/sbdesignth/defaultImageLibrary/user%20%283%29-1646288648.png"] {
height: 30px !important;
}
.product-info-main .product-info-price .price-box {
margin-bottom: 10px;
margin-top: 10px;
}
#fb-root{
display: none !important;
}
@media only screen and (max-width: 767px){
.product-social-links{
/* display: none; */
}
.product-info-main .product-info-price .price-box {
margin-bottom: 0px !important;
margin-top: -10px !important;
}
.product.media .show-sp~.product-reviews-summary{
padding: 3px 10px 5px !important;
}
.att-show-content .att-content-pdp .title-att {
font-size: 1.9rem !important;
}
img[src="https://image.useinsider.com/sbdesignth/defaultImageLibrary/user%20%283%29-1646288648.png"] {
height: 30px !important;
}
.size-label {
font-size: 1.4rem !important;
}
.catalog-product-view .product.media .page-title-wrapper .size-label {
font-size: 1.4rem;
}
.privatesale-event-container .privatesale-countdown-timer:before, .catalog-product-view .header-one .privatesale-countdown-
timer:before {
width: 41px !important;
height: 41px !important;
background-size: 41px 41px !important;
background-image: url
(https://www.sbdesignsquare.com/static/version1649216841/frontend/Isobar/sb/th_TH/Plumrocket_PrivateSale/images/timer.svg)
!important;
align-items: center;
justify-content: center;
text-align: center;
display: block;
}
.catalog-product-view .products-grid .product-items .product-item.product-item-sbsider {
width: calc((100% - 6%)/2) !important;
}
#hasCountdown{
font-size: 2.1rem !important;
}
.popupSbsider{
display: unset !important;
margin-left: auto;
margin-right: auto;
position: fixed !important;
padding-top: 40% !important;
left: 0 !important;
top: 0 !important;
height: 100%;
overflow: auto !important;
background-color: rgb(82 82 82 / 90%) !important;
z-index: 2147483646 !important;
text-align: center !important;
width: 100% !important;
transform : unset !important;
}
.closeSbSiderScracth{
position: fixed;
top: 23% !important;
right: 6% !important;
color: #f1f1f1;
font-size: 23px;
transition: 0.3s;
cursor: pointer;
color: black;
}
.privatesale-event-container .sb-sider-private-countdown:before{
margin-left: 30%;
}
#sbSiderPopupModal div{
width: 100% !important;
}
#sbSiderFeedbackModal .sbsiderFeedbackMain{
width: 80% !important;
}
}
.labels {
z-index: 1;
position: absolute;
width: auto !important;
}
.sbsiderDiscount {
display: flex;
position: absolute;
width: auto;
height: 30px;
padding: 10px;
background-color: rgb(247, 65, 65) !important;
top: calc(0% - 0px);
right: calc(0% - 0px);
left: unset;
z-index: 55;
border: 0px solid #000000 !important;
justify-content: center;
align-items: center;
border-radius: 5px !important;
}
.sbsiderDiscountText{
display: block;
border-radius: initial!important;
font-style: inherit;
text-align: inherit;
font-size: 1.4rem;
color: white;
box-sizing: border-box;
font-weight: 700;
}
.product-item-sbsider{
border: unset !important;
}
.flip-clock {
text-align: center;
perspective: 600px;
margin: 0 auto;
}
.flip-clock *,
.flip-clock *:before,
.flip-clock *:after {
box-sizing: border-box;
}
.flip-clock__piece {
display: inline-block;
margin: 0 0.2vw;
padding: 10px 2px;
}
.flip-card {
display: block;
position: relative;
padding-bottom: 0.72em;
font-size: 2rem;
line-height: 0.95;
}
.flip-card-bundle {
display: block;
position: relative;
padding-bottom: 0.72em;
font-size: 2rem;
line-height: 0.95;
}
@media (min-width: 1000px) {
.sendUpSellTag_bannerProduct3106{
height: 180px !important;
}
.flip-clock__piece {
margin: 0 5px;
padding: 6px 0px 10px 0px;
}
.flip-card {
display: block;
position: relative;
padding-bottom: 0.72em;
font-size: 2.25rem;
line-height: 0.95;
}
.flip-card-bundle {
display: block;
position: relative;
padding-bottom: 0.72em;
font-size: 2.25rem;
line-height: 0.95;
}
}
.flip-clock__slot {
font-size: 1rem;
line-height: 1.5;
display: block;
color:white;
/*
//position: relative;
//top: -1.6em;
z-index: 10;
//color: #FFF;
*/
}
.timer-sbsider-bundle{
padding-left: 40%;
}
.timer-sbsider{
padding-left: unset;
}
.flip-card__top,
.flip-card__bottom,
.flip-card__back-bottom,
.flip-card__back::before,
.flip-card__back::after {
display: block;
height: 0.72em;
color: #ccc;
background: #222;
padding: 0.23em 0.25em 0.4em;
border-radius: 0.15em 0.15em 0 0;
backface-visiblity: hidden;
transform-style: preserve-3d;
width: 2em;
}
@media (min-width: 1000px) {
.flashsale-infoline{
margin: 0px 50px 0px 0px;
}
.flip-clock__slot {
font-size: 9px;
color: white;
}
.flip-card {
font-size: 2rem;
}
.flip-card-bundle {
font-size: 14px;
}
.timer-sbsider-bundle{
padding-left: 53%;
}
.timer-sbsider{
padding-left: unset;
}
.flip-card__top,
.flip-card__bottom,
.flip-card__back-bottom,
.flip-card__back::before,
.flip-card__back::after {
display: block;
height: 0.72em;
color: #ccc;
background: #222;
padding: 0.23em 0.25em 0.4em;
border-radius: 0.15em 0.15em 0 0;
backface-visiblity: hidden;
transform-style: preserve-3d;
width: 2.8em;
/*////////////////////////แต่งเพิ่มเวลา////////////////*/
/* border-top: solid 1px #e7af7e !important;
color: #ffffff !important;
background: #e7af7e !important; */
}
}
/*////////////////////////////////////////*/
.flip-card__bottom,
.flip-card__back-bottom {
color: #FFF;
position: absolute;
top: 50%;
left: 0;
border-top: solid 1px #000;
background: #393939;
border-radius: 0 0 0.15em 0.15em;
pointer-events: none;
overflow: hidden;
z-index: 2;
}
.flip-card__back-bottom {
z-index: 1;
}
.flip-card__bottom::after,
.flip-card__back-bottom::after {
display: block;
margin-top: -0.72em;
}
.flip-card__back::before,
.flip-card__bottom::after,
.flip-card__back-bottom::after {
content: attr(data-value);
}
.flip-card__back {
position: absolute;
top: 0;
height: 100%;
left: 0%;
pointer-events: none;
}
.flip-card__back::before {
position: relative;
overflow: hidden;
z-index: -1;
}
.flip .flip-card__back::before {
z-index: 1;
-webkit-animation: flipTop 0.3s cubic-bezier(0.37, 0.01, 0.94, 0.35);
animation: flipTop 0.3s cubic-bezier(0.37, 0.01, 0.94, 0.35);
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
transform-origin: center bottom;
}
.flip .flip-card__bottom {
transform-origin: center top;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation: flipBottom 0.6s cubic-bezier(0.15, 0.45, 0.28, 1);
animation: flipBottom 0.6s cubic-bezier(0.15, 0.45, 0.28, 1);
}
@-webkit-keyframes flipTop {
0% {
transform: rotateX(0deg);
z-index: 2;
}
0%,
99% {
opacity: 1;
}
100% {
transform: rotateX(-90deg);
opacity: 0;
}
}
@keyframes flipTop {
0% {
transform: rotateX(0deg);
z-index: 2;
}
0%,
99% {
opacity: 1;
}
100% {
transform: rotateX(-90deg);
opacity: 0;
}
}
@-webkit-keyframes flipBottom {
0%,
50% {
z-index: -1;
transform: rotateX(90deg);
opacity: 0;
}
51% {
opacity: 1;
}
100% {
opacity: 1;
transform: rotateX(0deg);
z-index: 5;
}
}
@keyframes flipBottom {
0%,
50% {
z-index: -1;
transform: rotateX(90deg);
opacity: 0;
}
51% {
opacity: 1;
}
100% {
opacity: 1;
transform: rotateX(0deg);
z-index: 5;
}
}
.devMode{
left: 10px;
right: unset;
position: fixed;
bottom: 76px!important;
z-index: 100;
margin: auto;
width: 300px;
height: 130px;
background: #f4f8f9;
place-content: center;
grid-template-columns: 100px 1fr;
grid-template-rows: 1fr 30px;
border-radius: 9px;
border: 2px solid #000000;
box-shadow: 0 9px 10px rgb(0 0 0 / 30%), 0 3px 30px rgb(0 0 0 / 0%);
padding: 8px 0.25rem!important;
}
.devMode-message{
width: 100%;
max-width: 572px;
margin: 0;
border-left: 2px solid var(--color);
padding-left: 1rem;
font-size: 13px;
padding-top: 5px;
color: #000;
line-height: 14px;
font-weight: normal!important;
padding-left: 35px;
}
.contrainer{
display: flex;
background-color: white;
justify-content: center;
}
.content-cartCoupon{
display: block;
width: 100%;
float: left;
}
.box-cartCoupon{
display: flex;
position: relative;
width: calc(100% - 52%);
height: 130px;
background-color: white;
border: 1px solid #d3d3d3;
padding: 0px 0px 0px 0px;
margin: 5px;
}
.box-cartCoupon::after{
content: "";
position: absolute;
top:35%;
left: -5%;
width: 35px;
height: 35px;
color: white;
background-color: white;
border-right: 1px solid #d3d3d3;
border-radius: 100%;
z-index: 10;
}
.box-cartCoupon::before{
content: "";
position: absolute;
top:35%;
right: -3%;
width: 35px;
height: 35px;
color: white;
background-color: white;
border-left: 1px solid #d3d3d3;
border-radius: 100%;
z-index: 10;
}
.white-box{
width: 100%;
height: 100%;
padding: 10px 10px 10px 10px;
}
.head-white-box{
display: flex;
justify-content: space-between;
width: 100%;
}
.text-1{
color: #e00005;
width: auto;
height: 18px;
font-size: 20px;
font-weight: bold;
font-family: 'Inter', sans-serif;
margin-bottom: 0px;
}
.text-2{
color: white;
background-color: #e00005;
width: 123px;
height: 21px;
font-size: 11px;
text-align: center;
padding: 5px 0;
margin-bottom: 0px;
}
.body-white-box{
width: 95%;
height: auto;
margin-top: 15px;
}
.text-3{
font-size: 13px;
white-space: normal !important;
margin-bottom: 0px;
}
.footer-white-box{
/* display: flex;
justify-content: space-between;
margin-top: 10px; */
display: inline;
/* display: none; */
justify-content: space-between;
margin-top: 10px;
text-align: right;
padding-bottom: 10px;
position: relative;
left: 69%;
top: 0%;
}
.text-4{
font-size: 11px;
color: #c9c9c9;
margin: auto 0;
margin-bottom: 0px;
}
.button-cartCoupon{
width: 79.35px;
height: 28.76px;
color: white;
background-color: #e00005;
border: none;
border-radius: 5px;
font-size: 14px;
}
.red-box-cartCoupon{
width: 60%;
background: #e00005;
color: white;
padding: 2px 6px 0px 8px;
}
.top-cartCoupon{
display: flex;
padding-left: 15px;
padding-top: 23px;
}
.top-left-cartCoupon{
font-size: 70px;
font-weight: bold;
position: relative;
flex-shrink: 0;
letter-spacing: -1px;
font-family: 'Prompt', sans-serif;
margin-top: -10px;
}
.top-right-cartCoupon{
flex-grow: 1;
display: flex;
flex-direction: column;
padding-top: 11px;
padding-left: 5px;
}
.top-right-text-cartCoupon{
display: flex;
font-size: 13px;
margin-top: 4px;
font-family: 'Prompt', sans-serif;
position: absolute;
}
.top-right-text-number-cartCoupon{
display: flex;
font-family: 'Prompt', sans-serif;
position: absolute;
left:14%;
font-size:17px;
margin-top:-10px;
}
.top-right-percent-cartCoupon{
display: flex;
font-size: 49px;
font-weight: bold;
position: absolute;
margin-top: 3px;
font-family: 'Prompt', sans-serif;
}
.top-right-percent-number3-cartCoupon{
display: flex;
font-size: 41px;
font-weight: bold;
position: absolute;
margin-top: 3px;
font-family: 'Prompt', sans-serif;
left: 7%;
}
.top-right-percent-number4-cartCoupon{
display: flex;
font-size: 34px;
font-weight: bold;
position: absolute;
margin-top: 11px;
font-family: 'Prompt', sans-serif;
left: 6%;
}
.top-right-percent-number5-cartCoupon{
display: flex;
font-size: 34px;
font-weight: bold;
position: absolute;
margin-top: 11px;
font-family: 'Prompt', sans-serif;
left: 5%;
}
.buttom-right{
position: relative;
background: #e00005;
color: white;
padding: 0px 13px 0px 5px;
border: white solid 1px;
border-radius: 0px 10px 10px 0px;
font-size: 10px;
font-weight: 600;
font-family: 'Prompt', sans-serif;
}
.buttom-left{
background: white;
padding: 0px 2px 0px 8px;
border: white solid 1px;
border-radius: 10px 0px 0px 10px;
color: #e00005;
font-size: 10px;
font-weight: 600;
font-family: 'Prompt', sans-serif;
}
.divButtom{
text-align: center;
margin-top: -22px;
letter-spacing: -10px;
}
.divButtom-number{
text-align: center;
letter-spacing: -10px;
margin-top:66px;
}
.div-text{
font-size: 7px;
padding-top: 5px;
text-align: center;
font-family: 'Prompt', sans-serif;
letter-spacing: 0.5px;
}
.box-parent{
width: 100%;
display: block;
float: left;
}
@media only screen and (max-width: 767px) {
.timer-sbsider-bundle{
padding-left: 48%;
}
.flip-clock__slot {
font-size: 7px;
line-height: 1.5;
display: block;
color:white;
}
.flip-clock__piece {
display: inline-block;
margin: 0 0.2vw;
padding: 9px 2px;
}
.flashsale-infoline{
margin: 0px 0px 0px 0px;
}
.flip-card-bundle {
display: block;
position: relative;
padding-bottom: 0.72em;
font-size: 12px;
line-height: 0.95;
}
.content-cartCoupon{
display: block;
width: 100%;
float: left;
}
.box-cartCoupon{
display: flex;
position: relative;
width: 100%;
height: 130px;
background-color: white;
border: 1px solid #d3d3d3;
padding: 0px 0px 0px 0px;
margin : 0px
}
.box-cartCoupon::after{
content: "";
position: absolute;
top:35%;
left: -5%;
width: 35px;
height: 35px;
color: white;
background-color: white;
border-right: 1px solid #d3d3d3;
border-radius: 100%;
z-index: 10;
}
.box-cartCoupon::before{
content: "";
position: absolute;
top:35%;
right: -3%;
width: 35px;
height: 35px;
color: white;
background-color: white;
border-left: 1px solid #d3d3d3;
border-radius: 100%;
z-index: 10;
}
.white-box{
width: 100%;
height: 100%;
padding: 10px 10px 10px 10px;
}
.head-white-box{
display: flex;
justify-content: space-between;
width: 100%;
}
.text-1{
color: #e00005;
width: auto;
height: 18px;
font-size: 14px;
font-weight: bold;
font-family: 'Inter', sans-serif;
margin-bottom: 0px;
}
.text-2{
color: white;
background-color: #e00005;
width: 123px;
height: 21px;
font-size: 11px;
text-align: center;
padding: 5px 0;
margin-bottom: 0px;
}
.body-white-box{
width: 95%;
height: auto;
margin-top: 15px;
}
.text-3{
font-size: 11px;
white-space: normal !important;
margin-bottom: 0px;
}
.footer-white-box{
/*display: flex;
justify-content: space-between;
margin-top: 6px;*/
/* display: inline; */
display: none;
justify-content: space-between;
margin-top: 10px;
text-align: right;
padding-bottom: 10px;
position: relative;
left: 69%;
top: 0%;
}
.text-4{
font-size: 10px;
color: #c9c9c9;
margin: auto 0;
margin-bottom: 0px;
}
.button-cartCoupon{
width: 69.35px;
height: 27.76px;
color: white;
background-color: #e00005;
border: none;
border-radius: 5px;
font-size: 12px;
}
.red-box-cartCoupon{
width: 56%;
background: #e00005;
color: white;
padding: 2px 6px 0px 8px;
}
.top-cartCoupon{
display: flex;
padding-left: 15px !important;
padding-top: 17px;
}
.top-left-cartCoupon{
font-size: 59px;
font-weight: bold;
position: relative;
flex-shrink: 0;
letter-spacing: -1px;
font-family: 'Prompt', sans-serif;
margin-top: -10px;
}
.top-right-cartCoupon{
flex-grow: 1;
display: flex;
flex-direction: column;
padding-top: 11px;
padding-left: 5px;
}
.top-right-text-cartCoupon{
display: flex;
font-size: 9px;
margin-top: 4px;
font-family: 'Prompt', sans-serif;
position: absolute;
}
.top-right-text-number-cartCoupon{
display: flex;
font-family: 'Prompt', sans-serif;
position: absolute;
left:14%;
font-size:17px;
margin-top:-10px;
}
.top-right-percent-cartCoupon{
display: flex;
font-size: 35px;
font-weight: bold;
position: absolute;
margin-top: 3px;
font-family: 'Prompt', sans-serif;
}
.top-right-percent-number3-cartCoupon{
display: flex;
font-size: 36px;
font-weight: bold;
position: absolute;
margin-top: 3px;
font-family: 'Prompt', sans-serif;
left: 7%;
}
.top-right-percent-number4-cartCoupon{
display: flex;
font-size: 26px;
font-weight: bold;
position: absolute;
margin-top: 12px;
font-family: 'Prompt', sans-serif;
left: 6%;
}
.top-right-percent-number5-cartCoupon{
display: flex;
font-size: 26px;
font-weight: bold;
position: absolute;
margin-top: 12px;
font-family: 'Prompt', sans-serif;
left: 5%;
}
.buttom-right{
position: relative;
background: #e00005;
color: white;
padding: 0px 13px 0px 5px;
border: white solid 1px;
border-radius: 0px 10px 10px 0px;
font-size: 8px;
font-weight: 600;
font-family: 'Prompt', sans-serif;
}
.buttom-left{
background: white;
padding: 0px 2px 0px 8px;
border: white solid 1px;
border-radius: 10px 0px 0px 10px;
color: #e00005;
font-size: 8px;
font-weight: 600;
font-family: 'Prompt', sans-serif;
}
.divButtom{
text-align: center;
margin-top: -19px;
letter-spacing: -10px;
}
.div-text{
font-size: 7px;
padding-top: 9px;
text-align: center;
font-family: 'Prompt', sans-serif;
letter-spacing: 0.5px;
}
.box-parent{
display: block;
float: left;
margin: 0px;
}
}
.footerDiv .shop-product-title h2:before,.footerDiv .shop-product-title h2:after {
display: unset;
}
.popupSbsiderFeedback{
text-align: center;
display: unset;
position: relative;
margin-left: auto;
margin-right: auto;
width: 55%;
top: 10%;
left: 0%;
transform: translate(-50%, -50%);
}
.sbsiderFeedbackMain{
width: 40% !important;
background: white;
height: 380px;
margin: auto;
padding-bottom: 20px;
box-shadow: 0 0 20px #000000;
}
.closeSbSiderFeedback{
position: relative;
top: 30px;
color: #f1f1f1;
font-size: 40px;
transition: 0.3s;
cursor: pointer;
display: block;
margin-left: 43%;
}
.sbsiderFeedbackQuestion{
font-weight: bold;
padding-top: 15px;
padding-bottom: 15px;
background: black;
color: white;
}
.sbsiderFeedbackProgress{
height: 4px;
margin-bottom: 20px;
overflow: hidden;
background-color: #f5f5f5;
-webkit-box-shadow: inset 0 1px 2px rgb(0 0 0 / 10%);
box-shadow: inset 0 1px 2px rgb(0 0 0 / 10%);
width: 100% !important;
margin-top: -20px;
}
.sbsiderFeedbackProgress-bar{
-webkit-animation: progress-bar-stripes 2s linear infinite;
-o-animation: progress-bar-stripes 2s linear infinite;
animation: progress-bar-stripes 2s linear infinite;
background-color: #5cb85c;
width: 0%;
}
.sbsiderFeedbackUl{
list-style-type: none;
text-align: left;
padding-left: 30px;
padding-right: 30px;
margin-bottom: 0px;
overflow-y: auto;
max-height: 265px;
adding-bottom: 20px;
}
.sbsiderFeedbackLi{
padding-top: 5px;
padding-bottom: 5px;
border: 1px solid #c7c7c7;
padding-left: 10px;
margin-bottom: 15px;
border-radius: 5px;
cursor:pointer;
}
.sbsiderFeedbackBack{
background: rgb(4 4 4);
height: auto;
padding-bottom: 10px;
padding-top: 10px;
font-size: 23px;
color: white;
font-weight: bold;
width: 20% !important;
position: fixed;
left: 0;
text-align: center;
margin-left: 30%;
border: 1px solid;
cursor: pointer;
}
.sbsiderFeedbackNext{
background: rgb(4 4 4);
height: auto;
padding-bottom: 10px;
padding-top: 10px;
font-size: 23px;
color: white;
font-weight: bold;
width: 20%;
position: fixed;
right: 0;
margin-right: 30%;
border: 1px solid;
cursor: pointer;
}
.sbsiderFeedbackNextF{
background: rgb(4 4 4);
height: auto;
padding-bottom: 10px;
padding-top: 10px;
font-size: 23px;
color: white;
font-weight: bold;
width: 40%;
position: fixed;
right: 0;
margin-right: 30%;
border: 1px solid;
cursor: pointer;
}
#sbSiderFeedbackModal{
position: fixed;
padding-top: 100px;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
background-color: #00000096;
z-index: 2147483646;
text-align: center;
}
#sbSiderPopupModal{
position: fixed;
padding-top: 100px;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
background-color: #00000096;
z-index: 2147483646;
text-align: center;
}
#sbUpsellStoryModal{
position: fixed;
padding-top: 0px;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
background-color: rgb(255 255 255);
z-index: 2147483646;
text-align: center;
background-image: url("https://image.useinsider.com/sbdesignth/defaultImageLibrary/New%20Project%20%2821%29-1659697936.jpeg");
background-color: #ffffff !important;
background-repeat: no-repeat;
background-position: center;
width: 100%;
height: 100%;
background-size: contain;
transition: background-image 1s ease-in-out 0s;
}
.sbsiderFeedbackSpan{
padding-left: 10px;
font-size: 20px;
}
.feedbackSelect{
border: 1px solid black;
}
.divAddToCartPopupKC{
left: calc(100% - 704px);
top: 108px;
position: fixed;
z-index: 999;
}
.divAddToCartPopupSBDS{
left: 41%;
top: 78px;
position: fixed;
z-index: 999;
}
@media only screen and (max-width: 767px) {
.footerBanner {
width: 100% !important;
}
.divAddToCartPopupSBDS{
left: calc(174.594px);
top: 32px;
position: fixed;
z-index: 999;
width: 200px;
}
.divAddToCartPopupKC{
left: calc(100% - 233px);
top: 82px;
position: fixed;
z-index: 999;
width: 200px;
}
.footerDiv {
width: 100% !important;
}
.sbsiderFeedbackBack{
background: rgb(4 4 4);
height: auto;
padding-bottom: 10px;
padding-top: 10px;
font-size: 23px;
color: white;
font-weight: bold;
width: 40% !important;
position: fixed;
left: 0;
text-align: center;
margin-left: 10%;
border: 1px solid;
cursor: pointer;
}
.sbsiderFeedbackNext{
background: rgb(4 4 4);
height: auto;
padding-bottom: 10px;
padding-top: 10px;
font-size: 23px;
color: white;
font-weight: bold;
width: 40%;
position: fixed;
right: 0;
margin-right: 10%;
border: 1px solid;
cursor: pointer;
}
.sbsiderFeedbackNextF{
background: rgb(4 4 4);
height: auto;
padding-bottom: 10px;
padding-top: 10px;
font-size: 23px;
color: white;
font-weight: bold;
width: 80%;
position: fixed;
right: 0;
margin-right: 10%;
border: 1px solid;
cursor: pointer;
}
.closeSbSiderFeedback{
/*position: absolute;
top: 5%;
right: 24%;
font-size: 23px;
transition: 0.3s;
cursor: pointer;
color: white;*/
position: relative;
top: 30px;
color: #f1f1f1;
font-size: 40px;
transition: 0.3s;
cursor: pointer;
display: block;
margin-left: 85%;
}
}
/*
@media only screen and (min-width: 1024) {
.ins-content-wrapper .ins-content-wrapper-3441{
float: right;
position: absolute;
left: 40%;
top: 14%;
}
img[src="https://image.useinsider.com/sbdesignth/defaultImageLibrary/user%20%283%29-1646288648.png"] {
height: 30px !important;
}
} */
@media only screen and (min-width: 481px) and (max-width:1025px) {
.footerBanner {
width: 49% !important;
}
.footerDiv {
width: 75% !important;
}
.divAddToCartPopupKC {
left: calc(293.594px);
top: 108px;
position: fixed;
z-index: 999;
}
.divAddToCartPopupSBDS {
left: calc(610.594px);
top: 80px;
position: fixed;
z-index: 999;
}
}
.quote-slider{
margin-bottom: 0px;
list-style: none;
position: relative;
height: 40px;
display: block;
font-size: 19px;
text-align: center;
background-color: rgb(245, 245, 245) !important;
padding-top: 9px;
cursor: pointer;
}
.quote-slider {
margin-bottom: 0px;
list-style: none;
position: relative;
height: 40px;
display: block;
font-size: 19px;
text-align: center;
background-color: rgb(245, 245, 245) !important;
padding-top: 9px;
}
.quote-slider li {
display: inline-block;
position: absolute;
/*top: 50%;*/
transform: translateY(-50%);
right: 0%;
width: 100%;
padding-top: 12px;
font-size: 30px;
color: #fff;
text-align: center;
z-index: 2;
}
.quote-slider li .site {
font-style: normal;
margin-top: 40px;
font-size: 36px;
}
.quote-slider .arrow {
position: absolute;
top: 0;
width: 70px;
color: #fff;
font-weight: 700;
font-size: 100px;
height: 100%;
line-height: 400px;
padding-left: 40px;
}
.quote-slider .arrow.right {
right: 0;
}
.quote-slider .arrow.left {
left: 0;
}
.quote-slider a{
text-decoration: none;
color : black;
}
.py-20 {
padding-bottom: 11rem;
}
.bg-gray-300 {
--tw-bg-opacity: 1;
background-color: rgba(209,213,219,var(--tw-bg-opacity));
}
.shadow-lg {
--tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1),0 4px 6px -2px rgba(0, 0, 0, 0.05);
box-shadow: var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);
}
.bg-white {
--tw-bg-opacity: 1;
background-color: rgba(255,255,255,var(--tw-bg-opacity));
}
.rounded-lg {
border-radius: 0.5rem;
}
.overflow-hidden {
overflow: hidden;
}
.mx-auto {
margin-left: auto;
margin-right: auto;
}
.bg-white {
--tw-bg-opacity: 1;
background-color: rgba(255,255,255,var(--tw-bg-opacity));
}
.px-5 {
padding-right: 1.25rem;
}
.py-5 {
padding-top: 1.25rem;
}
.w-full {
width: auto;
}
.items-center {
align-items: center;
padding: 0px 35px 0px 0px;
}
@media only screen and (max-width: 767px) {
.w-full {
width: 100%;
}
.items-center {
align-items: center;
padding: 0px 10px 0px 0px;
}
}
.flex {
display: flex;
}
.w-full ul{
list-style: none;
margin: 0;
padding: 0;
}
.flex-col {
flex-direction: column;
}
.w-full ul>li{
margin-top: 0;
margin-bottom: 1rem;
--tw-space-x-reverse: 0;
margin-right: calc(1rem * var(--tw-space-x-reverse));
margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
}
.p-1 {
margin-bottom: 0px;
padding: 0.25rem;
}
.to-red-500 {
--tw-gradient-to: #6e44ef;
}
.from-yellow-200 {
--tw-gradient-from: #8af8fd;
--tw-gradient-stops: #8af8fd,var(--tw-gradient-to, rgba(253, 230, 138, 0));
}
.bg-gradient-to-br {
background-image: linear-gradient(to bottom right,var(--tw-gradient-stops));
}
.rounded-full {
border-radius: 100%;
width: 80px;
display: flex;
}
.transition {
transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;
transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;
transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;
transition-timing-function: cubic-bezier(0.4,0,0.2,1);
transition-duration: 150ms;
}
.bg-white img {
max-width: 100%;
height: 68px;
}
.text-sm {
font-size: .875rem;
line-height: 1.25rem;
}
.overflow-ellipsis {
text-overflow: ellipsis;
}
.w-16 {
width: 6rem;
text-align: center;
}
.transform {
--tw-translate-x: 0;
--tw-translate-y: 0;
--tw-rotate: 0;
--tw-skew-x: 0;
--tw-skew-y: 0;
--tw-scale-x: 1;
--tw-scale-y: 1;
transform: translateX(var(--tw-translate-x)) translateY(var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.progress-container {
display: flex;
flex-direction: row;
width: 80vw;
padding: 10px 0;
cursor: pointer;
}
.progress {
height: 2px;
flex-grow: 1;
border-radius: 4px;
margin: 0 2px;
display: flex;
background-image: -webkit-linear-gradient(left,
rgba(255,255,255,.5) 0%,
rgba(255,255,255,.5) 50%,
rgba(88, 89, 104,.5) 50.001%,
rgba(88, 89, 104,.5) 100%
);
background-repeat: no-repeat;
background-size: 200%;
backgound-color: #666;
background-position: 100% 50%;
animation-timing-function: linear;
animation-delay: .2s;
}
.progress.active {
animation-name: Loader;
}
.progress.passed {
background-position: 0 0;
}
@-webkit-keyframes Loader {
0% { background-position: 100% 0; }
100% { background-position: 0 0; }
}
/************************/
/************************/
/***** DEBUG STYLES *****/
/************************/
/************************/
.pause:hover .progress {
animation-play-state: paused;
}
.pause .not-hovered {
display: block;
}
.pause .hovered {
display: none;
}
.pause:hover .not-hovered {
display: none;
}
.pause:hover .hovered {
display: block;
}
.closesbUpsellStory{
position: absolute;
top: 33px;
right: 7px;
color: #000000;
font-size: 40px;
transition: 0.3s;
cursor: pointer;
width: 29px;
}
.divClosesbUpsellStory{
width: 100% !important;
display: block;
margin-left: auto;
margin-right: auto;
width: 40%;
position: fixed;
top: 3%;
left: 50%;
transform: translate(-50%, -50%);
}
.buttonReadMore{
color: white !important;
text-decoration: underline !important;
background-image: none;
background: #24b4cc;
border: 1px solid #24b4cc;
color: #fff;
cursor: pointer;
display: inline-block;
font-family: 'Prompt','Helvetica Neue',Helvetica,Arial,sans-serif;
font-weight: 400;
margin: 0;
padding: 7px 15px;
font-size: 1.4rem;
line-height: 1.6rem;
box-sizing: border-box;
vertical-align: middle;
border-radius: 60px;
}
.divReadMorebUpsellStory{
bottom: 5%;
left: 50%;
top: 95%;
position: relative;
width: 100% !important;
display: block;
margin-left: auto;
margin-right: auto;
width: 40%;
transform: translate(-50%, -50%);
}
.container-hotspot {
width: 100%;
display: flex;
flex-flow: column nowrap;
justify-content: flex-start;
align-items: center;
padding:0px;
}
.lg-container {
max-width: unset;
position: relative;
padding: 0;
}
.lg-image {
display: block;
height: 100%;
width: 100%;
object-fit: scale-down;
}
.lg-hotspot {
position: absolute;
margin: 0;
padding: 0;
transform: translate(-50%, -50%);
z-index: 0;
cursor: pointer;
}
.lg-hotspot:hover .lg-hotspot__button, .lg-hotspot:active .lg-hotspot__button {
border-color: #ff774c;
}
.lg-hotspot:hover .lg-hotspot__button:after, .lg-hotspot:active .lg-hotspot__button:after {
background-color: #ff774c;
}
.lg-hotspot--selected {
z-index: 999;
}
.lg-hotspot--selected .lg-hotspot__label {
opacity: 1;
}
.lg-hotspot__button {
height: 48px;
width: 48px;
padding: 0px;
border-radius: 100%;
border: 1px solid transparent;
box-shadow: 0 2px 4px rgb(0 0 0 / 20%);
z-index: 999;
animation: button-pulse 7s ease-in-out infinite;
background-color: #df0006;
}
.lg-hotspot__button img{
width: 33px !important;
top: 8px;
position: absolute;
left: 4px;
}
.lg-hotspot__label {
position: absolute;
padding: 0 0 1.1em 0;
width: 24em;
max-width: 50vw;
background-color: white;
box-shadow: 0 2px 4px rgb(0 0 0 / 20%);
font-size: 14.5px;
line-height: 1.45em;
z-index: -1;
border-radius: 2px;
user-select: none;
opacity: 0;
transition: all 0.1s linear;
}
.lg-hotspot__label h4 {
cursor: pointer;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
overflow: hidden;
min-height: 2px;
margin: 0;
padding: 9px 10px 4px 10px;
background-color: #555;
font-size: 1.1em;
font-weight: normal;
letter-spacing: 0.02em;
color: white;
border-radius: 2px 2px 0 0;
}
.lg-hotspot__label p {
margin: 0;
padding: 13px 10px 6px 10px;
color: #333;
}
.lg-hotspot--top-left .lg-hotspot__label {
top: 24px;
left: 24px;
}
.lg-hotspot--top-right .lg-hotspot__label {
top: 24px;
right: 24px;
}
.lg-hotspot--bottom-right .lg-hotspot__label {
top: 24px;
right: 24px;
}
.lg-hotspot-left .lg-hotspot__label {
right: 72px;
bottom: -80px;
}
.lg-hotspot-right .lg-hotspot__label {
left: 72px;
bottom: -80px;
}
.lg-hotspot-top .lg-hotspot__label {
left: -150px;
bottom: 76px;
}
.lg-hotspot-bottom .lg-hotspot__label {
left: -150px;
top: 76px;
}
.lg-hotspot-bottom .lg-hotspot__label:after {
content: '';
width: 0;
height: 0;
border: 20px solid transparent;
vertical-align: middle;
top: -39px;
border-left-color: #555;
position: absolute;
left: 152px;
transform: rotate(270deg);
}
.lg-hotspot-top .lg-hotspot__label:after {
content: '';
width: 0;
height: 0;
border: 20px solid transparent;
vertical-align: middle;
bottom: -39px;
border-left-color: #ffffff;
position: absolute;
left: 152px;
transform: rotate(90deg);
}
.lg-hotspot-right .lg-hotspot__label:after {
content: '';
width: 0;
height: 0;
border: 20px solid transparent;
vertical-align: middle;
top: 43%;
border-left-color: #ffffff;
position: absolute;
left: -39px;
transform: rotate(180deg);
}
.lg-hotspot-left .lg-hotspot__label:after {
content: '';
width: 0;
height: 0;
border: 20px solid transparent;
vertical-align: middle;
top: 43%;
border-left-color: #ffffff;
position: absolute;
float: right;
}
.lg-hotspot--bottom-left .lg-hotspot__label {
bottom: 24px;
left: 24px;
}
@keyframes button-pulse {
0% {
transform: scale(1, 1);
opacity: 1;
}
40% {
transform: scale(1.15, 1.15);
opacity: 1;
}
100% {
transform: scale(1, 1);
opacity: 1;
}
}
.readmoreUrl:after {
font-family: 'luma-icons';
content: '\e613';
transform: rotate(90deg);
display: inline-block;
font-size: 1.2rem;
font-weight: 400;
}
.noti-upsell{
display: block;
width: 80px;
height: 80px;
min-height: 60px;
min-width: 60px;
border-radius: 100% !important;
overflow: hidden;
left: 10px;
right: unset;
position: fixed;
bottom: 55px!important;
z-index: 100;
margin: auto;
box-shadow: unset;
padding: 8px 0.25rem!important;
border: unset;
cursor:pointer;
}
.noti-bell-upsell{
border-radius: 50% !important;
display: block;
margin: 0 auto;
position: absolute;
top: 0%;
left: 0%;
}
.noti-circle-upsell{
position: fixed;
width: 32px;
left: 4.9%;
bottom: 11%;
z-index: 5;
background: black;
border-radius: 50%;
border: 4px solid white;
}
.noti-image-upsell{
display: block;
margin: 0 auto;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
-o-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
max-width: 67px;
max-height: 67px;
}
.noti-count-upsell{
position: fixed;
left: 5.9%;
bottom: 11.7%;
z-index: 99;
font-size: 13px;
font-weight: 700;
color: white;
}
.noti-model-upsell{
z-index: 555;
left: 0.5%;
right: unset;
position: fixed;
bottom: 9%;
margin: auto;
width: 30%;
height: 180px;
background: #f4f8f9;
place-content: center;
grid-template-columns: 100px 1fr;
grid-template-rows: 1fr 30px;
border-radius: 9px;
box-shadow: 0 9px 10px rgb(0 0 0 / 30%), 0 3px 30px rgb(0 0 0 / 0%);
}
.noti-header-model-upsell{
height: 60px;
width: 100%;
border-radius: 8px 8px 0 0 !important;
background-color: #f74141;
display: flex;
justify-content: center;
align-items: center;
}
.noti-close-model-upsell{
cursor: pointer;
position: absolute;
background: #00000059;
border-radius: 50%;
padding: 0px 7px 2px 7px;
color: white;
right: 5px;
top: 7px;
}
.noti-header-text-model-upsell{
width: 100%;
font-size: 20px;
padding-top: 5px;
color: white;
font-weight: 900 !important;
text-align: center;
padding-left: 0;
}
.noti-detail-model-upsell{
width: 100%;
height: auto;
overflow: auto;
padding: 10px 0 0 5px;
height: 101px;
width: 100%;
border-radius: 4px !important;
background-color: #FFFFFF;
position: relative;
display: flex;
flex-direction: row;
}
.noti-detail-image-model-upsell{
height: 80px;
width: 78px;
border-radius: 4px 0 0 4px !important;
background-color: #FD617F;
display: flex;
justify-content: center;
align-items: center;
box-sizing: border-box;
}
.noti-detail-text-model-upsell{
width: 245px;
height: 50px;
left: 5px;
top: 5px;
position: relative;
display: flex !important;
flex-direction: column;
padding-left: 10px;
cursor: pointer;
}
.noti-detail-text-title-model-upsell{
height: 17px;
line-height: 17px;
user-select: none;
font-weight: 700;
}
.noti-detail-text-description-model-upsell{
height: 17px;
line-height: 17px;
top: 5px;
padding-top: 5px;
user-select: none;
}
.noti-detail-readmore-model-upsell{
height: auto;
width: 116px;
position: absolute;
bottom: 3%;
left: 69%;
display: block;
cursor: pointer;
}
.policy{
font-size: 12px;
position: absolute;
padding-top: 20px;
display: block;
}
@media only screen and (min-width: 481px) and (max-width:768px) {
.policy{
font-size: 9px;
position: absolute;
padding-top: 20px;
display: block;
}
}
@media only screen and (max-width: 767px) {
.shop-seller {
padding: 0 0 10px 10px !important;
}
.noti-model-upsell{
z-index: 555;
left: 0.5%;
right: unset;
position: fixed;
bottom: 6%;
margin: auto;
width: 100%;
height: 180px;
background: #f4f8f9;
place-content: center;
grid-template-columns: 100px 1fr;
grid-template-rows: 1fr 30px;
border-radius: 9px;
box-shadow: 0 9px 10px rgb(0 0 0 / 30%), 0 3px 30px rgb(0 0 0 / 0%);
}
.policy{
font-size: 9.5px;
position: unset;
padding-top: 0px;
padding-bottom: 10px;
display: block;
}
.noti-count-upsell {
position: fixed;
left: 20.2%;
bottom: 12.6%;
z-index: 99;
font-size: 15px;
font-weight: 700;
}
.noti-circle-upsell {
position: fixed;
width: 36px;
left: 16.9%;
bottom: 12%;
z-index: 5;
background: black;
border-radius: 50%;
}
.lg-hotspot__label h4 {
cursor: pointer;
display: -webkit-box;
-webkit-line-clamp: 1;
-webkit-box-orient: vertical;
overflow: hidden;
min-height: 2px;
font-size: 13px;
margin: 0;
padding: 9px 10px 4px 10px;
background-color: #555;
font-weight: normal;
letter-spacing: 0.02em;
color: white;
border-radius: 2px 2px 0 0;
}
.lg-hotspot__label {
position: absolute;
padding: 0 0 1.1em 0;
width: 24em;
max-width: 65vw;
background-color: white;
box-shadow: 0 2px 4px rgb(0 0 0 / 20%);
font-size: 14.5px;
line-height: 1.45em;
z-index: -1;
border-radius: 2px;
user-select: none;
opacity: 0;
transition: all 0.1s linear;
}
.lg-hotspot__label p{
font-size: 24px !important;
}
.old-price-hotspot{
font-size: 10px !important;
}
.old-price-hotspot .price-label{
font-size: 10px !important;
}
.old-price-hotspot .price{
font-size: 10px !important;
}
}
.icon-gif-upsell{
min-height: 60px;
min-width: 60px;
overflow: hidden;
left: 10px;
right: unset;
position: fixed;
bottom: 55px!important;
z-index: 100;
margin: auto;
padding: 8px 0.25rem 8px 0.25rem!important;
cursor: pointer;
}
/* .icon-gif-image-upsell{
display: block;
margin: 0 auto;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 100%;
}*/
.icon-gif-close-upsell{
cursor: pointer;
background: #00000085;
border-radius: 50%;
padding: 0px 7px 2px 7px;
color: white;
right: 0%;
font-size: 17px;
font-weight: 700;
display: flex;
position: relative;
}
.discount-percent-hotspot{
display: block;
line-height: 9px;
padding: 7px 10px 0px 10px;
font-size: 14px;
color: #ce0000;
}
.old-price-hotspot{
margin: 0;
padding: 13px 10px 0 10px;
color: #666;
}
.lg-hotspot__label h4:after {
font-family: 'luma-icons';
content: '\1433';
display: inline-block;
font-size: 11px;
float: right;
font-weight: bold;
position: absolute;
right: 7px;
top: 11px;
}
.lg-hotspot:hover .lg-hotspot__button, .lg-hotspot:active .lg-hotspot__button {
border-color: transparent;
background-color: black;
}
.lg-hotspot:hover .lg-hotspot__button:after, .lg-hotspot:active .lg-hotspot__button:after {
background-color: #838383;
}
.divHotspotLeft{
width: 100%;
display: block;
position: relative;
-webkit-box-flex: 0;
flex: 0 0 50%;
max-width: 50%;
}
.divHotspotRight{
width: 100%;
display: block;
position: relative;
-webkit-box-flex: 0;
flex: 0 0 50%;
max-width: 50%;
}
.hotspotProduct{
border-bottom: 1px solid #dfdfdf;
}
.hotspot-product-compact{
display: grid;
grid-template-columns: max-content auto;
width: 100%;
max-width: unset;
grid-gap: calc(1.2rem + 1vw);
padding: 1.875rem 21px;
position: relative;
}
.hotspot-product-link{
color: rgb(var(--colour-text-and-icon-1, 17, 17, 17));
text-decoration: none;
display: block;
width: calc(7rem + 2vw);
align-self: center;
background-color: transparent;
}
.hotspot-product-compact-image{
position: relative;
margin: 0;
padding: 0;
}
.hotspot-box-square{
width: 100%;
position: relative;
height: auto;
display: block;
}
.hotspot-product-compact-bottom{
align-self: center;
display: grid;
grid-column-gap: 0.625rem;
column-gap: 0.625rem;
position: relative;
}
.hotspot-product-compact-link{
color: rgb(var(--colour-text-and-icon-1, 17, 17, 17));
text-decoration: none;
display: block;
}
.hotspot-compact-price-package{
margin-bottom: 0;
grid-template-rows: 5rem max-content 0;
}
.hotspot-compact-price-package-additional-info{
margin: 0;
padding: 0;
cursor:pointer;
}
.hotspot-header-section{
color: rgb(var(--colour-text-and-icon-1, 17, 17, 17));
font-size: 1rem;
line-height: 1.5;
font-weight: 700;
margin: 0;
padding: 0;
}
.hotspot-header-section-title{
font-size: 16px;
line-height: 1.571;
display: block;
font-weight: 700;
text-transform: uppercase;
color: rgb(var(--colour-text-and-icon-1, 17, 17, 17));
text-decoration: underline;
}
.hotspot-header-section-description{
max-height: 1.75rem;
width: unset;
color: rgb(var(--colour-text-and-icon-2, 72, 72, 72));
font-size: .875rem;
line-height: 1.571;
font-weight: 400;
letter-spacing: 0;
display: block;
margin-bottom: 0.5rem;
}
.hotspot-compact-price-package-price-wrapper{
align-self: center;
margin-bottom: 0;
min-height: 2.875rem;
display: inline-flex;
align-items: left;
flex-wrap: wrap;
}
.hotspot-price{
align-self: end;
display: inline-block;
font-weight: bold;
color: rgb(var(--colour-text-and-icon-1, 17, 17, 17));
}
.hotspot-price-integer{
font-size: 2.5rem;
line-height: .9090909091;
vertical-align: inherit;
}
.hotspot-price-currency{
unicode-bidi: bidi-override;
font-size: 1.875rem;
-webkit-margin-start: 0.125rem;
margin-inline-start: 0.125rem;
-webkit-margin-end: 0.125rem;
margin-inline-end: 0.125rem;
}
.divMainHotSpot{
display: flex;
}
.addToCartHotSpot{
float:right;
}
.tdSbcare{
padding: 0;
border-top: unset !important;
padding-bottom: 0px;
padding-top: 0px;
cursor: pointer;
}
.sbcareBanner{
/*width: 133%;
padding: 0;
max-width: fit-content;*/
}
.sbcareModel{
width : 50%;
display: block;
margin: auto;
background-color: #fff;
position: relative;
padding: 0;
outline: 0;
border-radius: 25px;
}
.divSbcareModel{
position: fixed;
padding-top: 50px;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
background-color: rgb(82 82 82 / 48%);
z-index: 2147483646;
text-align: center;
}
.closeSbcasePopup{
position: absolute;
top: -9px;
right: 15px;
color: #f1f1f1;
font-size: 40px;
transition: 0.3s;
cursor: pointer;
}
@media only screen and (max-width: 767px) {
.divHotspotLeft{
width: 100%;
display: block;
position: relative;
-webkit-box-flex: 0;
flex: 0 0 100%;
max-width: 100%;
}
.divHotspotRight{
width: 100%;
display: block;
position: relative;
-webkit-box-flex: 0;
flex: 0 0 100%;
max-width: 100%;
}
.divMainHotSpot{
display: unset;
}
.addToCartHotSpot{
float:left;
}
#openValentineModal{
/* display:none !important; */
}
.valentine-campaign-btn{
/* display:none !important; */
}
.tdSbcare{
padding: 0;
border-top: unset !important;
padding-bottom: 0px;
padding-top: 0px;
cursor: pointer;
}
.sbcareBanner{
/*width: 124%;
padding: 0;
max-width: fit-content;*/
}
.sbcareModel{
width : 90%;
display: block;
margin: auto;
background-color: #fff;
position: relative;
padding: 0;
outline: 0;
border-radius: 25px;
}
.divSbcareModel{
position: fixed;
padding-top: 50px;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
background-color: rgb(82 82 82 / 48%);
z-index: 2147483646;
text-align: center;
}
}
/* start css bundle*/
#sbSiderBundleModal{
position: fixed;
padding-top: 100px;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
background-color: #00000096;
z-index: 2147483646;
text-align: center;
}
.popupSbsiderBundle{
text-align: center;
display: unset;
position: relative;
margin-left: auto;
margin-right: auto;
width: 55%;
top: -4%;
left: 0%;
transform: translate(-50%, -50%);
}
.closeSbSiderBundle{
position: relative;
top: 10px;
color: #f1f1f1;
font-size: 40px;
transition: 0.3s;
cursor: pointer;
display: block;
margin-left: 48%;
}
.sbsiderBundleMain{
width: 45% !important;
background: white;
height: 665px;
margin: auto;
padding-bottom: 20px;
box-shadow: 0 0 20px #000000;
padding: 25px;
}
.modal-title-bundle{
display: flex;
justify-content: space-between;
align-items: center;
font-weight: 700;
font-size: 2.125rem;
line-height: 1.4;
box-sizing: border-box;
word-wrap: break-word;
}
.left-bundle{
width: 75%;
box-sizing: border-box;
word-wrap: break-word;
text-align: left;
}
.icon-check-circle-bundle{
margin-right: 0.5rem;
color: #3ec36f;
box-sizing: border-box;
word-wrap: break-word;
display: inline-block;
font-size: inherit;
height: 1em;
vertical-align: -0.125em;
}
.product-list-wrapper-bundle{
overflow-y: auto;
max-height: 53.5rem;
box-sizing: border-box;
word-wrap: break-word;
/* min-height: 53rem; */
}
.product-list-container-buuble{
margin-top: 1rem;
display: flex;
flex-direction: column;
box-sizing: border-box;
word-wrap: break-word;
}
.title-bundle{
font-weight: 700;
color: #d82b2b;
text-align: center;
background: #8080802e;
margin-bottom: 0rem;
font-size: 1.5rem;
margin-top: 0rem;
line-height: 1.9;
}
.normal-price{
/* position: absolute;
left: 13%; */
}
.product-container-bundle{
padding: 0.5rem 0.5rem 0;
display: flex;
}
.image-bundle{
object-fit: contain;
width: 6rem;
height: 6rem;
flex-shrink: 0;
}
.info-bundle{
flex-direction: row;
justify-content: space-between;
margin-left: 1rem;
width: 100%;
display: flex;
}
.name-bundle{
font-size: .875rem;
color: #252525;
line-height: 1.2;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
margin: 0;
overflow: hidden;
font-size: 15px;
}
.caption-bundle{
margin-top: 0.25rem;
color: rgba(0,0,0,.45);
font-size: 12px;
font-weight: 600;
line-height: 1.3;
}
.right-bundle{
text-align: right;
box-sizing: border-box;
word-wrap: break-word;
width: 60%;
}
.bought-product-list-container-bundle{
margin-top: 1rem;
display: flex;
flex-direction: column;
box-sizing: border-box;
word-wrap: break-word;
}
.bought-product-list-bundle{
margin-top: 0.5rem;
padding: 0.5rem;
border-radius: 0.25rem;
background-color: #f8f8f8;
}
.checkbox-container-bundle{
margin-right: 0.5rem;
padding: 0 0 0 1.5rem;
position: relative;
display: block;
padding-left: 1.75rem;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.checkbox-bundle{
display: none;
opacity: 0;
width: 0;
height: 0;
cursor: pointer;
box-sizing: border-box;
padding: 0;
}
.checkmark-buuble{
position: absolute;
top: 0;
left: 0;
height: 20px;
width: 20px;
display: flex;
align-items: center;
justify-content: center;
background-color: transparent;
border: 2px solid rgba(0,0,0,.7);
border-radius: 0.25rem;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
.separator-bundle{
height: 1px;
margin: 1rem 0;
background-color: rgba(0,0,0,.08);
box-sizing: border-box;
word-wrap: break-word;
}
.btn-group-bundle{
justify-content: flex-end;
display: flex;
align-items: center;
}
.btn-view-shopping-cart-bundle{
margin-right: 1rem;
width: fit-content;
border: solid black 1px;
padding: 0.5rem 1rem;
border-radius: 0.25rem;
font-size: 16px;
}
.btn-container-bundle{
width: auto;
position: relative;
}
.btn-primary-bundle{
width: 100%;
padding: 0.5rem 1rem;
margin: 0;
cursor: pointer;
font-weight: 600;
line-height: 1.5;
text-decoration: none;
color: #252525;
background-color: transparent;
border: none;
border-radius: 0.25rem;
color: white;
background-color: #2cb7ce;
border: 1px solid #2cb7ce;
font-size: 16px;
}
@media only screen and (max-width: 767px) {
.title-bundle{
font-weight: 700;
color: #d82b2b;
text-align: center;
background: #8080802e;
margin-bottom: 0rem;
font-size: 1.5rem;
margin-top: 0rem;
line-height: 1.9;
}
.modal-title-bundle{
display: flex;
justify-content: space-between;
align-items: center;
font-weight: 700;
font-size: 15px;
line-height: 1.4;
box-sizing: border-box;
word-wrap: break-word;
}
.normal-price{
/* position: inherit;
left: 13%; */
}
.product-list-wrapper-bundle {
overflow-y: auto;
max-height: 33.5rem;
box-sizing: border-box;
word-wrap: break-word;
min-height: 0rem;
}
.closeSbSiderBundle {
position: relative;
top: 10px;
color: #f1f1f1;
font-size: 40px;
transition: 0.3s;
cursor: pointer;
display: block;
margin-left: 91%;
}
.popupSbsiderBundle {
text-align: center;
display: unset;
position: relative;
margin-left: auto;
margin-right: auto;
width: 55%;
top: 35%;
left: 0%;
transform: translate(-50%, -50%);
}
.sbsiderBundleMain {
width: 100% !important;
background: white;
height: 425px;
margin: auto;
padding-bottom: 20px;
box-shadow: 0 0 20px #000000;
padding: 10px;
}
.btn-primary-bundle {
font-size: 13px;
}
.btn-view-shopping-cart-bundle{
font-size: 13px;
}
}
.divButtom{
display:none;
}
/* end css bundle*/
/* start css free gift*/
.productFreeGift{
position: absolute;
z-index: 1;
left: 10%;
top: 54%;
height: auto;
max-height: 81%;
width: 23%;
border: 1px solid #663B2B;
border-radius: 10px;
background: white;
cursor: pointer;
z-index: 2;
}
.productLabelFreeGift{
left:0%;
top: 0%;
z-index: 1;
position: absolute;
width: 100% !important;
border-top-left-radius: 8px;
border-top-right-radius: 8px;
height: 20px;
}
.productFreeGiftMain{
width: 100%;
background: #b92929;
border-bottom-left-radius: 8px;
border-bottom-right-radius: 8px;
}
.page-title-freegift{
display: block;
font-size: 11px;
text-align: center;
margin-bottom: 0px;
padding: 5px;
}
.productProductFreeGift{
border-top-left-radius: 8px;
border-top-right-radius: 8px;
}
.page-title-freegift span{
color: white;
}
#sbSiderFreeGiftModal{
position: fixed;
padding-top: 100px;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
background-color: #00000096;
z-index: 2147483646;
text-align: center;
}
.popupSbsiderFreeGift{
text-align: center;
display: unset;
position: relative;
margin-left: auto;
margin-right: auto;
width: 55%;
top: 7%;
left: 0%;
transform: translate(-50%, -50%);
}
.closeSbSiderFreeGift{
position: relative;
top: 10px;
color: #f1f1f1;
font-size: 20px;
transition: 0.3s;
cursor: pointer;
display: block;
margin-left: 52%;
}
.sbsiderFreeGiftMain{
width: 50% !important;
background: white;
height: auto;
margin: auto;
padding-bottom: 20px;
box-shadow: 0 0 20px #3f3f3f;
padding: 10px;
}
.page-title-wrapper-freegift{
text-align: left !important;
margin-bottom: 10px !important;
}
.page-title-model-freegift{
font-size: 16px !important;
display: block !important;
}
.page-title-model-freegift span{
line-height: 22px !important;
font-size: 22px !important;
}
.product-info-sku-freegift{
margin-top: 0px !important;
text-align: left !important;
line-height: 11px !important;
margin-bottom: 10px !important;
}
.brand-product-freegift span{
font-size: 12px !important;
}
.sku-product-freegift{
font-size: 12px !important;
}
.product-info-dimensions-freegift{
line-height: 10px !important;
margin-top: 0px !important;
text-align: left !important;
margin-bottom: 14px !important;
}
.product-dimensions-freegift{
font-size: 14px !important;
}
.product-info-price-freegift{
margin-bottom: 0px !important;
color: #575757;
display: table;
width: 100%;
border-bottom: 0;
}
.price-final_price-freegift{
margin-top: 0px !important;
margin-bottom: 0px !important;
}
.special-price-freegift{
text-align: left !important;
line-height: 0px !important;
}
.price-final_price-freegift{
line-height: 0px !important;
}
.price-wrapper-freegift{
line-height: 0px !important;
margin-top: 0px !important;
font-size: 14px !important;
}
.special-price-freegift .price-freegift{
font-size: 28px !important;
}
.old-price-freegift .price-freegift{
font-size: 14px !important;
}
.old-price-freegift{
text-align: left !important;
width: 100% !important;
margin-top: -10px !important;
margin-bottom: 10px !important;
}
.price-label-freegift{
font-size: 14px !important;
}
.discount-percent-freegift{
font-size: 14px !important;
}
.product-info-stock-sku-freegift{
margin-top: -10px !important;
}
.product-info-stock-sku-freegift .stock span{
font-size: 14px !important;
}
.product-delivery-time-freegift{
font-size: 14px !important;
}
.product-add-form-freegift{
text-align: left !important;
}
.product-add-form-freegift .fieldset{
margin-bottom: 15px !important;
}
.product-detail-freegift{
text-align: left !important;
margin-top: 10px !important;
font-size: 12px !important;
}
.box-tocart-freegift{
margin-top: 0px !important;
margin-bottom: 20px !important;
}
.actions-cart-freegift{
width: 100% !important;
}
.tocart-freegift{
font-size: 14px !important;
padding: 5px !important;
margin-bottom: 0px !important;
}
.buynow-freegift{
font-size: 14px !important;
padding: 5px !important;
}
.popupSbsiderFreeGift .product-info-main{
padding-top: 10px !important;
}
.old-price-freegift .price-final_price{
font-size: 14px !important;
}
@media only screen and (max-width: 767px) {
/*.product-add-form{
position: fixed;
bottom: 0px;
}
.product-addto-links{
display: none;
}*/
.fotorama__stage__frame .fotorama__img {
top: 50% !important;
left: 50% !important;
}
.page-title-freegift{
font-size: 8px;
}
.productFreeGift{
position: absolute;
z-index: 1;
right: 0%;
top: unset;
bottom: 11%;
left: 10%;
height: auto;
max-height: 81%;
width: 23%;
border: 1px solid #663B2B;
border-radius: 10px;
background: white;
}
.productProductFreeGift{
padding-top: 7px;
}
.productLabelFreeGift {
height: 15px;
}
.sbsiderFreeGiftMain{
width: 65% !important;
height: auto;
}
.closeSbSiderFreeGift {
margin-left: 71%;
}
.popupSbsiderFreeGift{
top: -11%;
}
.page-title-wrapper-freegift{
display: block !important;
padding: 0px !important;
margin-bottom: 0px !important;
}
.product-info-sku-freegift{
display: block !important;
margin-bottom: 0px !important;
}
.product-info-dimensions-freegift{
display: block !important;
margin-bottom: 10px !important;
}
.page-title-model-freegift span{
font-size: 15px !important;
}
.brand-product-freegift span{
font-size: 10px !important;
}
.sku-product-freegift{
font-size: 10px !important;
margin-top: 5px;
}
.product-dimensions-freegift{
font-size: 10px !important;
}
.product-info-price-freegift{
margin-top: 15px;
}
.special-price-freegift .price-freegift{
font-size: 1.9rem !important;
}
.old-price-freegift .price-final_price{
font-size: 12px !important;
}
.old-price-freegift{
font-size: 12px;
margin-bottom: 10px !important;
}
.price-freegift{
font-size: 12px !important;
}
.discount-percent-freegift{
font-size: 12px !important;
}
.product-info-stock-sku-freegift{
font-size: 12px !important;
margin-top: 0px !important;
}
.product-info-stock-sku-freegift .stock span{
font-size: 12px !important;
}
.product-delivery-time-freegift{
font-size: 12px !important;
}
.box-tocart-freegift{
margin-bottom: 10px !important;
}
.product-info-price-freegift{
margin-top: 15px !important;
}
.price-label-freegift{
font-size: 12px !important;
}
.price-wrapper-freegift span{
font-size: 12px !important;
}
.old-price-freegift .price-freegift{
font-size: 12px !important;
}
.product-add-form-freegift .fieldset{
font-size: 10px !important;
}
}
/* end css free gift */
@media only screen and (min-device-width: 768px) and (max-device-width: 1366px) and (orientation: portrait) {
/* .block.widget .products-grid .product-items.widget-viewed-grid .product-item{
width: calc((128% - 3%) / 4) !important;
grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)) !important;
gap: 20px; display: grid !important;
} */
.catalog-product-view .products-grid:not(.products-related) .product-items .product-item .product-item-info, .review-product-list .products-grid:not(.products-related) .product-items .product-item .product-item-info, .catalog-product-view .block-viewed-products-grid:not(.products-related) .product-items .product-item .product-item-info, .review-product-list .block-viewed-products-grid:not(.products-related) .product-items .product-item .product-item-info {
height: 100% !important;
}
.catalog-product-view .block-viewed-products-grid:not(.products-related) .product-items .product-item .product-item-info, .review-product-list .block-viewed-products-grid:not(.products-related) .product-items .product-item .product-item-info{
width: 94% !important;
}
.product-item-info .old-price.update , .product-item .old-price.update, .product-item-item .old-price.update{
padding-top: 2em;
margin-top: 1em;
left: 0px;
position: absolute;
padding: 15px 10px 20px 10px;
}
.flashsale-infoline-pdp .flip-clock {
text-align: center;
perspective: 600px;
margin: 3px 0px 0px 100px !important;
}
.flashsale-infoline-pdp .timer-sbsider-bundle {
padding-left: 18% !important;
}
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1366px) and (orientation: landscape) {
/* .block.widget .products-grid .product-items.widget-viewed-grid .product-item{
width: calc((100% - 3%) / 4) !important;
} */
.flashsale-infoline-pdp .timer-sbsider-bundle {
padding-left: 34% !important;
padding-top: 0px !important;
}
}
.product-item-size {
margin-top: 0px !important;
}
.chat-open .chat-input{
display : none !important;
}
img[src="https://media.sbdesignsquare.com/media/mplabel/label/Icon_ReturnForBetter2025_1.png"] {
height: 22% !important;
}
.product-item img[src="https://media.sbdesignsquare.com/media/mplabel/label/Icon_ReturnForBetter2025_1.png"] {
height: 31% !important;
}
.flip-clock-plp {
text-align: right !important;
margin-right: 12px !important;
margin-top: -4px !important;
}
.reviews-actions .action.add{
display:none;
}
@media (min-width: 1000px) {
.product-item .flip-clock__slot {
text-align: center;
}
.product-item .flip-card-bundle {
padding-bottom: 0em;
}
}
@media only screen and (max-width: 767px) {
.product-item .flip-card-bundle {
display: block;
position: relative;
padding-bottom: 0em;
font-size: 12px;
line-height: 0.95;
}
.product-item .flip-clock__slot {
text-align: center;
}
div.main-content-media .product.media .productLabels {
width: auto;
height: 45px !important;
z-index: 1;
display: block;
}
img[src="https://media.sbdesignsquare.com/media/mplabel/label/Icon_ReturnForBetter2025_1.png"] {
height: 22% !important;
}
.product-item img[src="https://media.sbdesignsquare.com/media/mplabel/label/Icon_ReturnForBetter2025_1.png"] {
height: 31% !important;
}
.amgdprcookie-bar-container .amgdprcookie-policy {
margin-bottom: 0px !important;
max-width: 1500px !important;
text-align: left !important;
}
}