PATH:
home
/
niazsaze
/
public_html
/
wp-content
/
plugins
/
flatsome-plus
/
inc
/
addons
/
amazing-slider
/
assets
/
css
/* global css */ /* add taheri for slider*/ .slider-count .timer-second-count p:nth-child(2){ margin:0 auto; } .amazing-slider-title .feature_product_decstop ul{ height:75px; overflow:auto; } /* حالت اول */ .amazing-slider-title .feature_product_decstop ul::-webkit-scrollbar { width: 12px; } .amazing-slider-title .feature_product_decstop ul::-webkit-scrollbar-thumb { background: #c6c6c6 !important; border-radius: 10px; border: 4px solid #ffffff; } /* حالت دوم */ /* .amazing-slider-title .feature_product_decstop ul::-webkit-scrollbar-track { background: #efefef; } .amazing-slider-title .feature_product_decstop ul::-webkit-scrollbar { width: 5px; } .amazing-slider-title .feature_product_decstop ul::-webkit-scrollbar-thumb { background: #c6c6c6 !important; border-radius: 10px; } */ /* اتمام حالت دوم */ .swiper1 .product-name{ bottom:8.5%; } .swiper-content .swiper-content-right .amazing-slider-details{ padding:.5rem .5rem .1rem .5rem } .swiper1 .button-next .swiper-button-next1::after{ align-items: baseline; } .swiper1 .button-prev .swiper-button-prev1::after{ align-items: baseline; } /* mobile */ .swiper-container-mobile .amzing-slider-content-mobile{ height:438px } .swiper-container-mobile .amzing-slider-content-mobile .slider-img-mobile img{ max-width: 227px; max-height: 227px; } .slider-timer-mobile{ height: 44px; } .slider-prices-mobile{ height:25px } .swiper2 .swiper-button-next2::after { position: absolute; top: 63%; left: 50%; transform: translate(-50%, -50%); } .swiper2 .swiper-button-prev2::after{ position: absolute; right: 15%; top: 32%; } .img-responsive { width: 100%; height: auto; } .finish-product { position: absolute; top: 0; left: 0; width: 100%; height: 100%; backdrop-filter: blur(4px); z-index: 999; } .finish-product img { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } /******** */ /*swiper */ .swiper-container { position: absolute; top: 20%; left: 6%; width: 74%; height: 317px; background-color: white; border-radius: 40px; box-shadow: 0 0 20px 7px #87878733; } .swiper { width: 100%; height: 100%; border-radius: 40px; } .swiper-slide { background: #fff; position: relative; } .swiper-slide .swiper-content { display: flex; gap: 1rem; border-radius: 40px; position: relative; border-radius: 20px; padding: 1.3rem; } .swiper-content .swiper-content-left { width: 32%; height: 277px; display: flex; justify-content: center; border-radius: 20px; } .swiper-content .swiper-content-left img { width: 100%; border-radius: 20px; } .swiper-content .swiper-content-right { width: 70%; height: 277px; border-radius: 20px; display: flex; flex-direction: column; padding: 1rem 0rem 0 0; } @media screen and (max-width:1110px) { .swiper-content .swiper-content-right { padding: 0rem; } } .swiper-content-right .amazing-slider-product { width: 100%; } .swiper-content-right .amazing-slider-details { width: 100%; height: 120px; border: 1px solid #E0E0E0; border-radius: 30px; display: flex; flex-direction: column; gap: .5rem; padding: .7rem .5rem; } .amazing-slider-product { display: flex; } .amazing-slider-product .amazing-slider-title { width: 50%; text-align: right; } .amazing-slider-product .amazing-slider-timer { width: 50%; align-self: flex-start; display: flex; justify-content: flex-end; gap: .5rem; } .amazing-slider-timer>div { position: relative; width: 37px; height: 37px; display: flex; flex-direction: column; justify-content: center; align-items: center; } .amazing-slider-timer>div p:nth-child(2) { font-size: 14px; font-weight: bold; position: absolute; top: 5%; } .amazing-slider-timer>div p:nth-child(3) { font-size: 8px; font-weight: normal; color: #9D9D9D; position: absolute; top: 50%; } .foreground-circle { transition: stroke-dashoffset 1s linear; } .amazing-slider-title p.category-icon { font-size: 12px; font-weight: normal; color: #959595; background-color: #EFEFEF; border-radius: 5px; width: 100px; height: 19px; margin: .5rem 0 .5rem 0; display: flex; justify-content: center; align-items: center; } .amazing-slider-title p span { content: url(../img/category.svg); margin-left: .3rem; } .amazing-slider-title ul { margin: .5rem 1.5rem; } .amazing-slider-title ul li { font-size: 16px; font-weight: normal; color: #B9B9B9; } .amazing-slider-title ul li span:nth-child(2) { color: #696969; } .amazing-slider-details div.perfume-details { display: flex; justify-content: space-between; } div.perfume-details .perfume-detailes-price { width: 70%; display: flex; align-items: center; } .price-label { display: flex; align-items: center; } .perfume-detailes-price .price-label span:nth-child(1) { content: url(../img/moneys.svg); margin-left: .3rem; } .perfume-detailes-price .price-values { margin-right: .3rem; } .perfume-detailes-price .price-values span:nth-child(1) { font-size: 15px; color: #BBBBBB; text-decoration: line-through; } .perfume-detailes-price .price-values .discounted-price { display: inline-block; margin-right: .8rem; font-weight: 700; margin-bottom: 0; } .perfume-detailes-price .price-values .discounted-price span { text-decoration: none; padding-right: .3rem; font-weight: 700; } .original-price span.woocommerce-Price-currencySymbol { display: none; } div.perfume-details .add-perfume-btn { width: 28%; min-height: 36px; padding: .2rem .5rem; background: linear-gradient(198deg, var(--fplus-amazing-layout1-color) 0%, var(--fplus-amazing-layout1-color) 100%); border-radius: 78px; display: flex; justify-content: center; align-items: center; } div.perfume-details .add-perfume-btn a { font-size: 15px; font-weight: 300; color: #ffffff; } /* .amazing-slider-details div.perfume-name { border-radius: 100px; background: linear-gradient(198deg, var(--fplus-amazing-layout1-color) 0%, var(--fplus-amazing-layout1-color) 100%); height: 50px; display: flex; align-items: center; justify-content: space-around; gap: .4rem; padding: .3rem; } */ .slider-count { width: 41px; height: 40px; position: relative; } .slider-count span { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 16px; font-weight: bold; } /* .slider-next, .slider-prev { background: #ffffff; border-radius: 100px; height: 40px; width: 49%; display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: normal; color: #868686; position: relative; transition: all .2s linear; } */ /* .slider-next .slider-next-text { position: relative; right: -12%; } */ /* @media screen and (max-width:1110px){ .slider-prev .slider-prev-text{ position: relative; right: 7%; } .slider-next .slider-next-text{ position: relative; right: -6%; } } */ .slider-count svg { position: absolute; top: 0; left: 0; padding: .1rem; } .slider-count { width: 37px; height: 37px; position: relative; display: flex; align-items: center; justify-content: center; } .slider-count .timer-second-count { background-color: rgb(255, 255, 255); position: relative; width: 37px; height: 37px; display: flex; flex-direction: column; justify-content: center; align-items: center; border-radius: 50%; } /* amazing-slider */ .amazing_slider_wrapper { position: relative; width: 100%; ; } .amazing_slider_container { width: 100%; height: 299px; border-radius: 36px; background: linear-gradient(198deg, var(--fplus-amazing-layout1-color) 0%, var(--fplus-amazing-layout1-color) 100%); } .amazing-slider-bg { position: relative; width: 70%; height: 100%; background-image: url(../img/Union.png); background-repeat: no-repeat; background-size: auto; background-position-y: bottom; } .amazing-slider-bg .product-amazing { width: 200px; font-size: 34px; font-weight: 800; color: #ffffff; position: relative; right: 2.5rem; top: 5rem; filter: drop-shadow(0px 0px 1px #ffffff); text-align: justify; } .amazing-slider-bg .btn-show-products { position: relative; right: 2.5rem; top: 6.5rem; width: 171px; height: 44px; border-radius: 8px; background: #ffffff; display: flex; justify-content: center; align-items: center; } .amazing-slider-bg .btn-show-products a { font-size: 1.1rem; font-weight: normal; color: var(--fplus-amazing-layout1-color); } @media screen and (max-width:991px) { .amazing_slider_wrapper { display: none; } } /* mobile slider */ .amazing_slider_wrapper-mobile { max-width: 900px; position: relative; margin: 0 auto; } .amazing_slider_container-mobile { width: 100%; height: 435px; border-radius: 36px; background: linear-gradient(198deg, var(--fplus-amazing-layout1-color) 0%, var(--fplus-amazing-layout1-color) 100%); } .amazing-slider-bg-mobile { background-image: url(../img/Union.png); background-repeat: no-repeat; height: 100%; padding-top: 1.5rem; } .amazing-slider-bg-mobile .product-amazing-mobile { font-size: 34px; font-weight: 800; color: #ffffff; display: flex; justify-content: center; filter: drop-shadow(0px 0px 1px #ffffff); } .amzing-slider-content-mobile { padding: 1.2rem; height: 452px; } .amzing-slider-content-mobile .slider-img-mobile { width: 100%; display: flex; justify-content: center; position: relative; } .slider-img-mobile .slider-timer-top { position: absolute; top: 2%; left: -1%; display: flex; align-items: center; justify-content: center; } .slider-timer-top .timer-second-mobile { position: relative; } .slider-timer-top .timer-second-mobile p { position: absolute; top: 40%; left: 50%; transform: translate(-50%, -50%); } .amzing-slider-content-mobile .slider-img-mobile img { border-radius: 20px; max-width: 250px; max-height: 250px; } .amzing-slider-content-mobile .slider-detailse-mobile { display: flex; align-items: center; justify-content: space-between; gap: .5rem; height: 50px; background: linear-gradient(198deg, var(--fplus-amazing-layout1-color) 0%, var(--fplus-amazing-layout1-color) 100%); border-radius: 100px; padding: 0 .3rem; margin-top: 1rem; } .slider-detailse-mobile .slider-left-arrow, .slider-detailse-mobile .slider-rigth-arrow { width: 40px; height: 40px; background: #ffffff; border-radius: 100px; position: relative; } .slider-detailse-mobile .slider-name { width: 70%; height: 80%; background: #ffffff; border-radius: 70px; display: flex; justify-content: center; align-items: center; font-size: 14px; font-weight: 600; } .slider-prices-mobile { display: flex; margin-top: 5.3rem; } .slider-prices-mobile .price-cont { width: 30%; display: flex; align-items: center; } .slider-prices-mobile .price-cont span { content: url(../img/moneys.svg); margin-left: .3rem; } .swiper-button-next, .swiper-container-rtl .swiper-button-prev, .swiper-button-prev, .swiper-container-rtl .swiper-button-next{ background-image: none; } .slider-prices-mobile .slider-price { width: 70%; display: flex; justify-content: flex-end; gap: 1.2rem; } .slider-price div.discounted-price { display: inline-block; font-weight: 600; } .slider-price p { font-size: 15; font-weight: normal; color: #BBBBBB; text-decoration: line-through; } div.discounted-price span { color: #A6A6A6; font-weight: 400; } .slider-timer-mobile { display: flex; width: 100%; align-items: center; justify-content: space-between; margin-top: 1rem; gap: 1rem; } .slider-timer-mobile .slider-basket { width: 52px; height: 44px; background: linear-gradient(198deg, var(--fplus-amazing-layout1-color) 0%, var(--fplus-amazing-layout1-color) 100%); border-radius: 78px; display: flex; justify-content: center; align-items: center; color: #ffffff; } .slider-timer-mobile .slider-basket i { content: url(../img/shopping-cart.svg); } .slider-timer-mobile .slider-timer { width: 80%; display: flex; justify-content: space-between; align-items: center; height: 44px; border-radius: 40px; background: #EAEAEA; padding: 0 .3rem; } .slider-timer-mobile .slider-timer>div { width: 49px; height: 36px; border-radius: 70px; background: #ffffff; display: flex; flex-direction: column; } .slider-timer-mobile .slider-timer>div span:nth-child(1) { font-size: 13px; color: #404040; font-weight: normal; } .slider-timer-mobile .slider-timer>div span:nth-child(2) { color: #9D9D9D; font-size: 8px; } /* dektab arrow */ .product-name { height: 50px; background: linear-gradient(198deg, var(--fplus-amazing-layout1-color) 0%, var(--fplus-amazing-layout1-color) 100%); position: absolute; width: 63%; bottom: 9%; z-index: 20; left: 3%; display: flex; justify-content: space-between; align-items: center; border-radius: 100px; padding: 0 .3rem; gap: .5rem; } .button-prev, .button-next { width: 252px; height: 40px; position: relative; border-radius: 100px; background: #ffffff; display: flex; align-items: center; transition: all .2s linear; line-height: 18px; /* padding: 0 1rem; */ } .button-prev { justify-content: flex-end; padding-right: 1rem; } .button-prev .product-name-left, .button-next .product-name-rigth { margin-left: 1rem; transition: all .2s linear; font-size: 14px; font-weight: normal; color: #868686; } .button-next .product-name-rigth { margin-right: 1rem; } .button-prev:hover, .button-next:hover { top: .04rem; position: relative; } .button-prev:hover .product-name-left, .button-next:hover .product-name-rigth { color: rgb(32, 32, 32); transition: all .2s linear; } /* mobile arrow */ .product-name-mobile { position: absolute; width: 92%; height: 50px; background: linear-gradient(198deg, var(--fplus-amazing-layout1-color) 0%, var(--fplus-amazing-layout1-color) 100%) !important; left: 0%; right: 0%; bottom: 26%; display: flex; align-items: center; justify-content: space-between; gap:.3rem; border-radius: 100px; margin: 0 auto; padding: 0 .3rem; z-index: 30; } .slider-left-arrow2 { width: 40px; height: 40px; border-radius: 100%; background-color: #ffffff; display: flex; justify-content: center; align-items: center; position: relative; } .slider-rigth-arrow2 { width: 40px; height: 40px; border-radius: 100%; background-color:#ffffff; display: flex; justify-content: center; align-items: center; position: relative; } .slider-name{ width: 226px; height: 40px; background: #ffffff; border-radius: 70px; display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 600; } .slider-name-product{ display: none; } /* تغییرات دسکتاب */ .swiper1 .swiper-button-next1 { /* background: none; */ color: black; position: relative; top: 0; margin-top: 0; width: 23px; height: 23px; border-radius: 50%; transition: all .5s linear; /* font-size: 20px; font-family: "Font Awesome 6 Free"; */ /* right: 35.5%; */ /* top: 85.5%; */ /* position: absolute; width: 23px; height: 23px; border-radius: 50%; display: flex; justify-content: center; align-items: center; transition: all .5s linear; */ } .swiper1 .swiper-button-next1::after { content: url(../img/arrow-left.svg); width: 23px; height: 23px; display: flex; justify-content: center; align-items: center; border-radius: 50%; transition: all .5s linear; line-height: 18px; } .swiper1 .swiper-button-prev1 { /* background: none; */ color: black; position: relative; top: 0; margin-top: 0; width: 23px; height: 23px; border-radius: 50%; transition: all .5s linear; /* font-family: "Font Awesome 6 Free"; font-weight: 900; font-size: 20px; */ /* left: 4.5%; */ /* top: 85.5%; */ /* width: 23px; height: 23px; border-radius: 50%; display: flex; justify-content: center; align-items: center; transition: all .5s linear; */ } .swiper1 .swiper-button-prev1::after { content: url(../img/arrow-left.svg); transform: rotateY(180deg); width: 23px; height: 23px; display: flex; justify-content: center; align-items: center; border-radius: 50%; transition: all .5s linear; line-height: 18px; } @media screen and (min-width:991px) { .swiper-container_m { margin-top: 200px; } .amazing-slider-mobile { display: none; } } /* تغییرات موبایل */ .swiper-container-mobile { width: 92%; overflow: hidden; position: absolute; top: 75%; left: 50%; transform: translate(-50%, -50%); border-radius: 40px; box-shadow: 0 0 10px 10px rgb(119 119 119 / 13%); } .swiper-slide { text-align: center; } .swiper2 .swiper-button-next2 { background: none; color: black; font-size: 10px; font-family: "Font Awesome 6 Free"; /* top: 0; margin-top: 0; */ position: absolute; /* right: 4%; */ /* right: 16%; */ top: 40%; left: 18%; /* position: relative; */ } .swiper2 .swiper-button-next2::after { content: url(../img/arrow-left.svg); /* کد ایکون فلش راست */ } .swiper2 .swiper-button-prev2 { background: none; color: black; font-family: "Font Awesome 6 Free"; font-weight: 900; font-size: 10px; position: absolute; right: 15%; top: 40%; /* position: relative; */ /* top: 0; margin-top: 0; */ } .swiper2 .swiper-button-prev2::after { content: url(../img/arrow-left.svg); transform: rotateY(180deg); } /* @media screen and (max-width:679px) { .swiper2 .swiper-button-next2{ left: 6%; } .swiper2 .swiper-button-prev2{ right: 6%; } } @media screen and (max-width:450px){ .swiper2 .swiper-button-next2{ left: 8%; } .swiper2 .swiper-button-prev2{ right: 8%; } } */
[-] style.css
[edit]
[-] swiper.min.css
[edit]
[-] master.css
[edit]
[+]
..