bs2sites.net
Open in
urlscan Pro
172.67.166.62
Public Scan
Submitted URL: http://bs2sites.net/css/style.css?97c2
Effective URL: https://bs2sites.net/css/style.css?97c2
Submission: On July 02 via api from US — Scanned from DE
Effective URL: https://bs2sites.net/css/style.css?97c2
Submission: On July 02 via api from US — Scanned from DE
Form analysis 0 forms found in the DOM
Text Content
.logo{
--tw-text-opacity: 1;
color:rgb(241 241 241 / var(--tw-text-opacity));
--fill: rgb(241 241 241 / .6)
}
.logo:hover,.logo:focus{
--tw-text-opacity: 1;
color:rgb(70 54 255 / var(--tw-text-opacity));
--fill: rgb(241 241 241 / .87)
}
.faq-drawer__content-wrapper {
line-height: 1.4em;
max-height: 0px;
overflow: hidden;
transition: 0.25s ease-in-out;
}
.faq-drawer__title {
cursor: pointer;
display: block;
font-size: 1.25em;
font-weight: 700;
position: relative;
margin-bottom: 0;
transition: all 0.25s ease-out;
}
/* OPTIONAL HOVER STATE */
.faq-drawer__title:hover {
color: #4E4B52 ;
}
.faq-drawer__trigger:checked
+ .faq-drawer__title
+ .faq-drawer__content-wrapper {
max-height: 350px;
}
@media only screen and (max-width: 600px) {
.container {
padding: 80px;
}
}
@media (max-width: 639px){
.nav__search{
width:2.25rem;
overflow:hidden
}
.nav__search:focus-within{
flex:1 1 0%;
background-color:#ffffff1a
}
.logo--nav:has(~.nav__search:focus-within){
display:none!important
}
}
@media (max-width: 1023px){
.nav{
transition:none;
box-shadow:0 -4px 0 4px #0f0f0f;
}
.mm{
display: none!important;
}
.m-py-3{
padding-top: .75rem!important;
padding-bottom: .75rem!important;
}
.m-pr-0{
padding-right: 0!important;
}
.mc{
display: block!important;
margin-bottom: -1rem;
}
}
@media (min-width: 1024px){
.nav{
background-color:#1e1e1efa!important
}
}
.nav__toggle:hover{
cursor:pointer;
--tw-text-opacity: 1;
color:rgb(241 241 241 / var(--tw-text-opacity))
}
.nav__toggle:focus-within{
--tw-bg-opacity: 1;
background-color:rgb(70 54 255 / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color:rgb(241 241 241 / var(--tw-text-opacity))
}
.nav>a[aria-current=page],.nav__toggle:has(:checked){
--tw-text-opacity: 1;
color:rgb(241 241 241 / var(--tw-text-opacity));
background-image:linear-gradient(232.18deg,#5F28A6 -20.02%,#1405B0 110.4%)
}
.nav:has(:checked){
border-bottom-right-radius:0;
border-bottom-left-radius:0
}
.nav__toggle:has(:checked)~.list-none.hidden{
display:grid
}
.breadcrumbs>:first-letter{
text-transform:uppercase
}
.field{
border-radius:9999px;
border-width:1px;
--tw-border-opacity: 1;
border-color:rgb(183 183 183 / var(--tw-border-opacity));
padding:.5rem .75rem;
--tw-text-opacity: 1;
color:rgb(47 47 47 / var(--tw-text-opacity))
}
.footer a.field:hover,.footer a.field:focus{
--tw-bg-opacity: 1;
background-color:rgb(70 54 255 / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color:rgb(249 250 251 / var(--tw-text-opacity))
}
.field:focus,.field:has(input):focus-within{
--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)
}
[role=doc-pagelist] a{
display:flex;
height:2.5rem;
width:2.5rem;
align-items:center;
justify-content:center;
border-radius:9999px
}
.footer a[role=doc-pagelist] a:hover,.footer a[role=doc-pagelist] a:focus{
--tw-bg-opacity: 1;
background-color:rgb(70 54 255 / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color:rgb(249 250 251 / var(--tw-text-opacity))
}
[role=doc-pagelist] a:hover,[role=doc-pagelist] a:focus{
--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)
}
[role=doc-pagelist] a:not([aria-current=page]){
border-width:1px
}
@media (max-width: 967px){
.pages a:not(.page--first):not(.page--last):not(.page--others):not([aria-current=page]){
display:none
}
.pages .others--sm {
display: block!important;
}
}
@media (min-width: 968px){
.pages .others--lg {
display: block!important;
}
}
.btn{
display:inline-grid;
grid-auto-flow:column;
align-items:center;
justify-content:center;
gap:.25rem;
border-radius:9999px;
padding:.5rem 1.25rem;
text-decoration-line:none
}
.footer a.btn:hover,.footer a.btn:focus{
--tw-bg-opacity: 1;
background-color:rgb(70 54 255 / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color:rgb(249 250 251 / var(--tw-text-opacity))
}
.btn{
transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;
transition-timing-function:cubic-bezier(.4,0,.2,1);
transition-duration:.5s
}
.btn--primary{
--tw-bg-opacity: 1;
background-color:rgb(70 54 255 / var(--tw-bg-opacity));
color:#fff!important
}
.btn--primary:focus,.btn--primary:hover{
--tw-bg-opacity: 1;
background-color:rgb(21 12 122 / var(--tw-bg-opacity))
}
.btn--outline{
cursor:pointer;
border-width:1px;
--tw-border-opacity: 1;
border-color:rgb(183 183 183 / var(--tw-border-opacity));
--tw-text-opacity: 1;
color:rgb(47 47 47 / var(--tw-text-opacity))
}
.btn--outline:not([aria-current=page]):focus,.btn--outline:not([aria-current=page]):hover{
--tw-border-opacity: 1;
border-color:rgb(70 54 255 / var(--tw-border-opacity));
--tw-text-opacity: 1;
color:rgb(70 54 255 / var(--tw-text-opacity))
}
.btn--outline[aria-current=page]{
border:0
}
[disabled]{
opacity:.38;
pointer-events:none
}
.modal{
background-color:#0f0f0f99;
-webkit-backdrop-filter:blur(4px);
backdrop-filter:blur(4px)
}
.divide-location>:not([hidden])~:not([hidden]){
--tw-divide-x-reverse: 0;
border-right-width:calc(1px * var(--tw-divide-x-reverse));
border-left-width:calc(1px * calc(1 - var(--tw-divide-x-reverse)))
}
.divide-location>*+*{
margin-left:.1rem;
padding-left:.35rem
}
.badge{
display: inline-flex;
align-items: center;
justify-content: center;
align-items:center;
justify-content:center;
border-radius:9999px;
padding: 1px 6px;
--tw-bg-opacity: 1;
background-color:rgb(70 54 255 / var(--tw-bg-opacity));
font-size:10px;
--tw-text-opacity: 1;
color:rgb(255 255 255 / var(--tw-text-opacity))
}
.footer a.badge:hover,.footer a.badge:focus{
--tw-bg-opacity: 1;
background-color:rgb(70 54 255 / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color:rgb(249 250 251 / var(--tw-text-opacity))
}
.fixed{
position:fixed
}
.absolute{
position:absolute
}
.relative{
position:relative
}
.sticky{
position:sticky
}
.inset-0{
inset:0
}
.inset-2{
inset:.5rem
}
.inset-2\.5{
inset:.625rem
}
.-inset-x-4{
left:-1rem;
right:-1rem
}
.-right-0{
right:-0px
}
.-right-0\.5{
right:-.125rem
}
.-top-0{
top:-0px
}
.-top-0\.5{
top:-.125rem
}
.left-auto{
left:auto
}
.top-0{
top:0
}
.top-1\/2{
top:50%
}
.top-28{
top:7rem
}
.top-full{
top:100%
}
.z-10{
z-index:10
}
.order-1{
order:1
}
.order-98{
order:98
}
.order-99{
order:99
}
.-m-1{
margin:-.25rem
}
.m-0{
margin:0
}
.m-auto{
margin:auto
}
.-mx-1{
margin-left:-.25rem;
margin-right:-.25rem
}
.-mx-4{
margin-left:-1rem;
margin-right:-1rem
}
.-mx-6{
margin-left:-1.5rem;
margin-right:-1.5rem
}
.-my-3{
margin-top:-.75rem;
margin-bottom:-.75rem
}
.-my-1{
margin-top:-.25rem;
margin-bottom:-.25rem
}
.mx-auto{
margin-left:auto;
margin-right:auto
}
.my-0{
margin-top: 0;
margin-bottom: 0
}
.my-1{
margin-top:.25rem;
margin-bottom:.25rem
}
.my-2{
margin-top:.5rem;
margin-bottom:.5rem
}
.my-3{
margin-top:.75rem;
margin-bottom:.75rem
}
.my-4{
margin-top:1rem;
margin-bottom:1rem
}
.-mb-0{
margin-bottom:-0px
}
.-mb-3{
margin-bottom:-.75rem
}
.-mb-0\.5{
margin-bottom:-.125rem
}
.-mb-4{
margin-bottom:-1rem
}
.-mb-8{
margin-bottom:-2rem;
}
.-ml-16{
margin-left:4rem
}
.-ml-4{
margin-left:-1rem
}
.-ml-1{
margin-left:-.25rem
}
.-mr-0\.75{
margin-right:-.1875rem
}
.-mr-1{
margin-right:-.25rem
}
.-mr-2{
margin-right:-.5rem
}
.-mt-1{
margin-top:-.25rem
}
.-mt-2{
margin-top:-.5rem
}
.-mt-5{
margin-top:-1.25rem
}
.mb-1{
margin-bottom: .25rem;
}
.mb-2{
margin-bottom:.5rem
}
.mb-3{
margin-bottom:.75rem
}
.mb-4{
margin-bottom:1rem
}
.mb-5{
margin-bottom:1.25rem
}
.mb-7{
margin-bottom:1.75rem
}
.ml-1{
margin-left:.25rem
}
.ml-2{
margin-left:.5rem
}
.ml-3{
margin-left:.75rem
}
.ml-6{
margin-left:1.5rem
}
.ml-16{
margin-left:-4rem
}
.ml-auto{
margin-left:auto
}
.mr-0\.5{
margin-right:.125rem
}
.mr-1{
margin-right:.25rem
}
.mr-2{
margin-right:.5rem
}
.mr-3{
margin-right:.75rem
}
.mr-4{
margin-right:1rem
}
.mr-6{
margin-right:1.5rem
}
.mr-auto{
margin-right:auto
}
.mt-0{
margin-top:0
}
.mt-0\.5{
margin-top:.125rem
}
.mt-1{
margin-top:.25rem
}
.mt-2{
margin-top:.5rem
}
.mt-2\.5{
margin-top:.625rem
}
.mt-3{
margin-top:.75rem
}
.mt-4{
margin-top:1rem
}
.mt-5{
margin-top:1.25rem
}
.mt-6{
margin-top:1.5rem
}
.mt-8{
margin-top:2rem
}
.mt-9{
margin-top:2.25rem
}
.line-clamp-1{
overflow:hidden;
display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-line-clamp:1;
}
.line-clamp-3{
overflow:hidden;
display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-line-clamp:3;
}
.block{
display:block
}
.inline-block{
display:inline-block
}
.flex{
display:flex
}
.inline-flex{
display:inline-flex
}
.table{
display:table
}
.grid{
display:grid
}
.hidden{
display:none
}
.h-12{
height:3rem
}
.h-24{
height:6rem
}
.min-h-screen{
min-height:100vh
}
.w-px{
width:1px
}
.w-12{
width:3rem
}
.w-24{
width:6rem
}
.w-40{
width: 10rem
}
.w-4{
width:1rem
}
.h-full{
height:100%
}
.w-full{
width:100%
}
.w-1\/3{
width:33.3%
}
.w-max{
width:-moz-max-content;
width:max-content
}
.min-w-max{
min-width:-moz-max-content;
min-width:max-content
}
.max-w-xs{
max-width:20rem
}
.flex-1{
flex:1 1 0%
}
.shrink-0{
flex-shrink:0
}
.basis-36{
flex-basis: 36%;
}
.basis-100{
flex-basis: 100%;
}
.basis-2\/3{
flex-basis:66.666667%
}
.rotate-180{
--tw-rotate: 180deg;
transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.transform{
transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.cursor-pointer{
cursor:pointer
}
.resize{
resize:both
}
.snap-x{
scroll-snap-type:x var(--tw-scroll-snap-strictness)
}
.snap-start{
scroll-snap-align:start
}
.list-none{
list-style-type:none
}
.grid-cols-2{
grid-template-columns:repeat(2,minmax(0,1fr))
}
.flex-col{
flex-direction:column
}
.flex-wrap{
flex-wrap:wrap
}
.place-content-center{
place-content:center
}
.place-items-start{
place-items:start
}
.content-start{
align-content:flex-start
}
.items-start{
align-items:flex-start
}
.items-center{
align-items:center
}
.items-end{
align-items:flex-end
}
.justify-start{
justify-content:flex-start
}
.justify-end{
justify-content:flex-end
}
.justify-center{
justify-content:center
}
.justify-between{
justify-content:space-between
}
.justify-around{
justify-content:space-around
}
.justify-evenly{
justify-content:space-evenly
}
.gap-1{
gap:.25rem
}
.gap-1\.5{
gap:.375rem
}
.gap-2{
gap:.5rem
}
.gap-3{
gap:.75rem
}
.gap-4{
gap:1rem
}
.gap-5{
gap:1.25rem
}
.gap-6{
gap:1.5rem
}
.gap-7{
gap:1.75rem
}
.gap-8{
gap:2rem
}
.gap-12{
gap:3rem
}
.gap-x-4{
-moz-column-gap:1rem;
column-gap:1rem
}
.gap-y-1{
row-gap:.25rem
}
.divide-x>:not([hidden])~:not([hidden]){
--tw-divide-x-reverse: 0;
border-right-width:calc(1px * var(--tw-divide-x-reverse));
border-left-width:calc(1px * calc(1 - var(--tw-divide-x-reverse)))
}
.self-start{
align-self:flex-start
}
.self-center{
align-self:center
}
.self-end{
align-self:flex-end
}
.justify-self-start{
justify-self:start
}
.justify-self-center{
justify-self:center
}
.overflow-auto{
overflow:auto
}
.overflow-hidden{
overflow:hidden
}
.overflow-scroll{
overflow:auto
}
.overflow-x-scroll{
overflow-x:auto
}
.whitespace-nowrap{
white-space:nowrap
}
.rounded-\[5px\]{
border-radius: 5px;
}
.rounded-2xl{
border-radius:1rem
}
.rounded-3xl{
border-radius:1.5rem
}
.rounded-full{
border-radius:9999px
}
.rounded-lg{
border-radius:.5rem
}
.rounded-xl{
border-radius:.75rem
}
.rounded-b-3xl{
border-bottom-right-radius:1.5rem;
border-bottom-left-radius:1.5rem
}
.border{
border-width:1px
}
.border-\[0\.5px\]{
border-width:.5px
}
.border-\[2px\]{
border-width:2px
}
.border-b{
border-bottom-width:1px
}
.border-l{
border-left-width:1px
}
.border-l-\[2px\]{
border-left-width:2px
}
.border-t{
border-top-width:1px
}
.border-blue-150{
--tw-border-opacity: 1;
border-color:rgb(70 54 255 / var(--tw-border-opacity))
}
.border-default-100{
--tw-border-opacity: 1;
border-color:rgb(183 183 183 / var(--tw-border-opacity))
}
.border-default-100\/10{
border-color:#b7b7b71a
}
.border-default-50{
--tw-border-opacity: 1;
border-color:rgb(241 241 241 / var(--tw-border-opacity))
}
.border-red-500{
--tw-border-opacity: 1;
border-color:rgb(239 68 68 / var(--tw-border-opacity))
}
.border-green-500{
--tw-border-opacity: 1;
border-color: rgb(34 197 94 / var(--tw-border-opacity))
}
.border-green-600{
--tw-border-opacity: 1;
border-color: rgb(22 163 74 / var(--tw-border-opacity))
}
.border-white{
--tw-border-opacity: 1;
border-color:rgb(255 255 255 / var(--tw-border-opacity))
}
.bg-blue-150{
--tw-bg-opacity: 1;
background-color:rgb(70 54 255 / var(--tw-bg-opacity))
}
.bg-blue-400{
--tw-bg-opacity: 0.3;
background-color:rgb(96 165 250 / var(--tw-bg-opacity))
}
.bg-blue-50{
--tw-bg-opacity: 1;
background-color:rgb(240 242 255 / var(--tw-bg-opacity))
}
.bg-red-300{
--tw-bg-opacity: 1;
background-color: rgb(252 165 165 / var(--tw-bg-opacity))
}
.bg-blue-300{
--tw-bg-opacity: 1;
background-color: rgb(147 197 253 / var(--tw-bg-opacity))
}
.bg-green-50{
--tw-bg-opacity: 1;
background-color:rgb(240 253 244 / var(--tw-bg-opacity))
}
.bg-default-50{
--tw-bg-opacity: 1;
background-color:rgb(241 241 241 / var(--tw-bg-opacity))
}
.bg-default-50\/h{
background-color:#f1f1f1de
}
.bg-default-50\/l{
background-color:#f1f1f161
}
.bg-inherit{
background-color:inherit
}
.bg-red-50{
--tw-bg-opacity: 1;
background-color:rgb(254 242 242 / var(--tw-bg-opacity))
}
.bg-red-500{
--tw-bg-opacity: 1;
background-color:rgb(239 68 68 / var(--tw-bg-opacity))
}
.bg-transparent{
background-color:transparent
}
.bg-white{
--tw-bg-opacity: 1;
background-color:rgb(255 255 255 / var(--tw-bg-opacity))
}
.bg-white\/10{
background-color:#ffffff1a
}
.bg-left{
background-position:left
}
.fill-red-500{
fill:#ef4444
}
.p-0{
padding:0
}
.p-0\.5{
padding:.125rem
}
.p-1{
padding:.25rem
}
.p-1\.5{
padding:.375rem
}
.p-11{
padding:2.75rem
}
.p-2{
padding:.5rem
}
.p-3{
padding:.75rem
}
.p-4{
padding:1rem
}
.p-6{
padding:1.5rem
}
.p-5{
padding:1.25rem
}
.p-7{
padding:1.75rem
}
.p-8{
padding:2rem
}
.px-2{
padding-left:.5rem;
padding-right:.5rem
}
.px-3{
padding-left:.75rem;
padding-right:.75rem
}
.px-4{
padding-left:1rem;
padding-right:1rem
}
.px-5{
padding-left:1.25rem;
padding-right:1.25rem
}
.px-7{
padding-left:1.75rem;
padding-right:1.75rem
}
.py-1{
padding-top:.25rem;
padding-bottom:.25rem
}
.py-1\.5{
padding-top:.375rem;
padding-bottom:.375rem
}
.py-2{
padding-top:.5rem;
padding-bottom:.5rem
}
.py-11{
padding-top:2.75rem;
padding-bottom:2.75rem
}
.py-3{
padding-top:.75rem;
padding-bottom:.75rem
}
.py-4{
padding-top:1rem;
padding-bottom:1rem
}
.py-5{
padding-top:1.25rem;
padding-bottom:1.25rem
}
.py-6{
padding-top:1.5rem;
padding-bottom:1.5rem
}
.py-8{
padding-top:2rem;
padding-bottom:2rem
}
.pb-0{
padding-bottom: 0
}
.pb-2{
padding-bottom:.5rem
}
.pb-3{
padding-bottom:.75rem
}
.pb-4{
padding-bottom: 1rem
}
.pb-5{
padding-bottom:1.25rem
}
.pb-8{
padding-bottom:2rem
}
.pl-0{
padding-left:0
}
.pl-2{
padding-left:0.5rem
}
.pl-16{
padding-left:4rem
}
.pl-3{
padding-left:.75rem
}
.pl-4{
padding-left:1rem
}
.pl-5{
padding-left:1.25rem
}
.pr-9{
padding-right: 2.25rem;
}
.pt-0{
padding-top:0
}
.pt-2{
padding-top:.5rem
}
.pt-3{
padding-top:.75rem
}
.pt-4{
padding-top:1rem
}
.pt-6{
padding-top:1.5rem
}
.text-left{
text-align:left
}
.text-right{
text-align:right
}
.text-center{
text-align:center
}
.text-justify{
text-align:justify
}
.text-2xl{
font-size: 1.5rem;
line-height: 2rem;
}
.text-3xl{
font-size:1.875rem;
line-height:2.25rem
}
.text-\[10px\]{
font-size:10px
}
.text-base{
font-size:1rem;
line-height:1.5rem
}
.text-lg{
font-size:1.125rem;
line-height:1.75rem
}
.text-sm{
font-size:.875rem;
line-height:1.25rem
}
.text-xl{
font-size:1.25rem;
line-height:1.75rem
}
.text-xs{
font-size:.75rem;
line-height:1rem
}
.line-height-1{
line-height: 1rem;
}
.font-normal{
font-weight:400
}
.font-semibold{
font-weight:600
}
.uppercase{
text-transform:uppercase
}
.leading-tight{
line-height:1.25
}
.text-accent-m{
--tw-text-opacity: 1;
color:rgb(156 148 255 / var(--tw-text-opacity))
}
.text-blue-150{
--tw-text-opacity: 1;
color:rgb(70 54 255 / var(--tw-text-opacity))
}
.text-default-100{
--tw-text-opacity: 1;
color:rgb(183 183 183 / var(--tw-text-opacity))
}
.text-default-100\/l{
color:#b7b7b761
}
.text-default-150{
--tw-text-opacity: 1;
color:rgb(117 117 117 / var(--tw-text-opacity))
}
.text-default-175{
--tw-text-opacity: 1;
color:rgb(47 47 47 / var(--tw-text-opacity))
}
.text-default-200{
--tw-text-opacity: 1;
color:rgb(15 15 15 / var(--tw-text-opacity))
}
.text-default-50{
--tw-text-opacity: 1;
color:rgb(241 241 241 / var(--tw-text-opacity))
}
.text-default-50\/l{
color:#f1f1f161
}
.text-default-50\/m{
color:#f1f1f199
}
.text-green-500{
--tw-text-opacity: 1;
color:rgb(34 197 94 / var(--tw-text-opacity))
}
.text-inherit{
color:inherit
}
.text-red-500{
--tw-text-opacity: 1;
color:rgb(239 68 68 / var(--tw-text-opacity))
}
.text-white{
--tw-text-opacity: 1;
color:rgb(255 255 255 / var(--tw-text-opacity))
}
.opacity-l{
opacity:.38
}
.opacity-m{
opacity:.6
}
.filter{
filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
}
.transition-colors{
transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;
transition-timing-function:cubic-bezier(.4,0,.2,1);
transition-duration:.15s
}
.duration-0{
transition-duration:0s
}
.state-gray:hover,.state-gray:focus{
background-color:#f1f1f11a
}
.state-blue:hover,.state-blue:focus{
--tw-bg-opacity: 1;
background-color:rgb(70 54 255 / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color:rgb(249 250 251 / var(--tw-text-opacity))
}
.clip-rect{
position:absolute;
clip:rect(0,0,0,0)
}
.scrollbar--thin::-webkit-scrollbar{
height:.5rem;
border-radius:.375rem
}
.scrollbar--thin::-webkit-scrollbar-thumb{
border-radius:.375rem;
--tw-bg-opacity: 1;
background-color:rgb(183 183 183 / var(--tw-bg-opacity));
border:2px solid white
}
.bg-arrow-down{
background-image:url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.2797 5.96667L8.93306 10.3133C8.41973 10.8267 7.57973 10.8267 7.06639 10.3133L2.71973 5.96667' stroke='%234636FF' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
background-repeat:no-repeat;
background-position:100% 65%
}
.bg-search{
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M9.58317 17.5001C13.9554 17.5001 17.4998 13.9557 17.4998 9.58341C17.4998 5.21116 13.9554 1.66675 9.58317 1.66675C5.21092 1.66675 1.6665 5.21116 1.6665 9.58341C1.6665 13.9557 5.21092 17.5001 9.58317 17.5001Z' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M18.3332 18.3334L16.6665 16.6667' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");
background-repeat:no-repeat;
background-position:calc(100% - .75rem) 50%
}
*,:before,:after{
border-color:#b7b7b761;
--tw-ring-opacity: 1;
--tw-ring-color: rgb(70 54 255 / var(--tw-ring-opacity));
--tw-ring-offset-width: 0px;
--tw-ring-offset-color: #F1F1F1;
box-sizing:border-box;
border-width:0;
border-style:solid;
scroll-behavior:smooth;
--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;
--tw-scroll-snap-strictness: proximity;
--tw-invert: 1;
--tw-ring-inset: ;
outline:none
}
:root{
--tw-bg-opacity: 1;
background-color:rgb(15 15 15 / var(--tw-bg-opacity));
color:#f1f1f199;
--fill: #facc15;
--fill-default: #B7B7B7
}
body{
margin:0;
font-size:.875rem;
line-height:1.25rem;
line-height:1.5
}
@media (min-width: 1536px){
body{
margin-left:auto;
margin-right:auto;
max-width:1536px
}
}
a{
color:currentColor;
text-decoration:none;
transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;
transition-timing-function:cubic-bezier(.4,0,.2,1);
transition-duration:.5s
}
a:hover,a:focus,[tabindex="0"]:hover,[tabindex="0"]:focus{
--tw-text-opacity: 1;
color:rgb(241 241 241 / var(--tw-text-opacity))
}
main a:hover,main a:focus{
color:currentColor
}
.link-hover:hover {
--tw-text-opacity: 1;
color:rgb(176 176 176 / var(--tw-text-opacity))
}
.footer a.rounded-full:hover,.footer a.rounded-full:focus{
--tw-bg-opacity: 1;
background-color:rgb(70 54 255 / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color:rgb(249 250 251 / var(--tw-text-opacity))
}
h1,h2,h3,h4,h5,h6{
margin:0;
font-weight:400
}
li::marker{
font-weight:600
}
main{
--tw-bg-opacity: 1;
background-color:rgb(255 255 255 / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color:rgb(117 117 117 / var(--tw-text-opacity))
}
main a[aria-current=page]{
--tw-bg-opacity: 1;
background-color:rgb(70 54 255 / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color:rgb(241 241 241 / var(--tw-text-opacity))
}
.header__currency{
border:0!important
}
.filter a[aria-current=page], .filter input[type=radio]:checked + label {
--tw-bg-opacity: 1;
background-color:rgb(81 109 254 / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color:rgb(241 241 241 / var(--tw-text-opacity))
}
.filter a[aria-current=page]:after, .filter input[type=radio]:checked + label:after{
content:"";
position:relative;
bottom:-1px;
margin-left:.5rem;
display:inline-flex;
height:1rem;
width:1.25rem;
background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 16 16' fill='none' %3E%3Cpath d='M9.62012 3.95337L13.6668 8.00004L9.62012 12.0467' stroke='white' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M2.33325 8H13.5533' stroke='white' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")
}
.filter a:focus>.badge,.filter a:hover>.badge,a[aria-current=page]>.badge,
.filter label:focus>.badge,.filter label:hover>.badge,label[aria-current=page]>.badge
.filter input[type=radio]:checked + label >.badge,.filter label:hover>.badge,.filter input[type=radio]:checked + label >.badge{
position:relative;
top:-1px;
--tw-bg-opacity: 1;
background-color:rgb(255 255 255 / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color:rgb(70 54 255 / var(--tw-text-opacity))
}
.filter input[type=radio] {
display: none;
}
.article{
font-size:1rem;
line-height:1.5rem;
--tw-text-opacity: 1;
color:rgb(47 47 47 / var(--tw-text-opacity))
}
.article p,.article ul,.article ol,.article h2,.article li{
margin:0;
margin-bottom:1.25rem
}
.article ul,.article ol{
padding:0;
padding-left:1.25rem
}
.article h2{
font-size:1.25rem;
line-height:1.75rem
}
.article li:last-of-type{
margin-bottom:0
}
img{
max-width:100%
}
button,input,optgroup,select,textarea{
font-family:inherit;
font-size:100%;
font-weight:400;
line-height:inherit;
letter-spacing:inherit;
margin:0;
padding:0;
color:currentColor
}
::-moz-placeholder{
font-family:inherit;
color:#b7b7b799
}
::placeholder,select:has([value=""]:checked){
font-family:inherit;
color:#b7b7b799
}
button{
cursor:pointer;
color:inherit;
background:transparent
}
input[type=checkbox]{
margin-right:.5rem;
display:inline-grid;
height:1.25rem;
width:1.25rem;
cursor:pointer;
-webkit-appearance:none;
-moz-appearance:none;
appearance:none;
border-radius:.25rem;
border-width:1px;
--tw-bg-opacity: 1;
background-color:rgb(255 255 255 / var(--tw-bg-opacity));
place-content:center
}
input[type=checkbox]:before{
content:"";
width:.65em;
height:.65em;
transform:scale(0);
transition:.12s transform ease-in-out;
box-shadow:inset 1em 1em #4636ff
}
input[type=checkbox]:checked:before{
transform:scale(1)
}
select{
cursor:pointer;
-webkit-appearance:none;
-moz-appearance:none;
appearance:none
}
select.field{
--tw-text-opacity: 1;
color:rgb(47 47 47 / var(--tw-text-opacity));
background-image:url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.2797 5.96667L8.93306 10.3133C8.41973 10.8267 7.57973 10.8267 7.06639 10.3133L2.71973 5.96667' stroke='%234636FF' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
background-repeat:no-repeat;
background-position:100% 65%;
background-position:calc(100% - .75rem) 50%
}
details summary::-webkit-details-marker,details summary::marker{
display:none;
content:""
}
details summary{
cursor:pointer
}
details summary:after{
content:"";
margin-left:auto;
margin-top:.125rem;
height:1rem;
width:1rem;
background-image:url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.2797 5.96667L8.93306 10.3133C8.41973 10.8267 7.57973 10.8267 7.06639 10.3133L2.71973 5.96667' stroke='%234636FF' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
background-repeat:no-repeat;
background-position:100% 65%;
transition-property:transform;
transition-timing-function:cubic-bezier(.4,0,.2,1);
transition-duration:.15s
}
details[open] summary:after{
--tw-rotate: 180deg;
transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
details[open] summary,summary:hover,summary:focus{
--tw-text-opacity: 1;
color:rgb(70 54 255 / var(--tw-text-opacity))
}
hr{
margin-top:0;
margin-bottom:0;
border-bottom-width:1px;
border-color:#ffffffde
}
table{
width:100%;
border-collapse:collapse
}
table th{
font-weight:400;
--tw-text-opacity: 1;
color:rgb(183 183 183 / var(--tw-text-opacity))
}
table th,table td{
border-width:1px;
--tw-border-opacity: 1;
border-color:rgb(241 241 241 / var(--tw-border-opacity));
padding:.5rem 1.25rem;
text-align:left
}
.filter label:has([type=checkbox]:checked){
font-weight:600;
--tw-text-opacity: 1;
color:rgb(47 47 47 / var(--tw-text-opacity))
}
.comment:last-of-type{
border:0
}
@media (min-width: 640px){
.nav__toggle:has(:checked)~.sm\:hidden.list-none{
display:grid
}
}
@media (min-width: 768px){
.nav__toggle:has(:checked)~.md\:hidden.list-none{
display:grid
}
}
@media (min-width: 1024px){
.nav__toggle:has(:checked)~.lg\:hidden.list-none{
display:grid
}
}
.focus-within\:ring-1:focus-within{
--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)
}
.hover\:ring-1:hover{
--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)
}
.focus\:ring-1:focus{
--tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
--tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow, 0 0 #0000)
}
.group:focus-within .group-focus-within\:grid{
display:grid
}
.group:hover .group-hover\:border-white\/h{
border-color:#ffffffde
}
.group:hover .group-hover\:text-blue-150{
--tw-text-opacity: 1;
color:rgb(70 54 255 / var(--tw-text-opacity))
}
.group:focus .group-focus\:border-white\/h{
border-color:#ffffffde
}
.group:focus .group-focus\:text-blue-150{
--tw-text-opacity: 1;
color:rgb(70 54 255 / var(--tw-text-opacity))
}
@media (min-width: 640px){
.sm\:-inset-x-8{
left:-2rem;
right:-2rem
}
.sm\:order-2{
order:2
}
.sm\:order-unset{
order:unset
}
.sm\:basis-72{
flex-basis:72%;
}
.sm\:border-l{
border-left-width:1px
}
.sm\:-mx-8{
margin-left:-2rem;
margin-right:-2rem
}
.sm\:mx-0{
margin-left:0;
margin-right:0
}
.sm\:mb-0{
margin-bottom:0
}
.sm\:mb-12{
margin-bottom:3rem
}
.sm\:ml-auto{
margin-left:auto
}
.sm\:ml-16{
margin-left:4rem
}
.sm\:mt-0{
margin-top:0
}
.sm\:mt-16{
margin-top:4rem
}
.sm\:mt-8{
margin-top:2rem
}
.sm\:block{
display:block
}
.sm\:inline{
display:inline
}
.sm\:flex{
display:flex
}
.sm\:items-end{
align-items:flex-end
}
.sm\:grid{
display:grid
}
.sm\:hidden{
display:none
}
.sm\:h-32{
height:8rem
}
.sm\:w-32{
width:8rem
}
.sm\:w-px{
width:1px
}
.sm\:w-px-i{
width:1px!important
}
.sm\:w-max{
width:-moz-max-content;
width:max-content;
}
.sm\:max-w-60{
max-width: 60%;
}
.sm\:w-1\/2{
width:50%;
}
.sm\:w-1\/3{
width:33.3%;
}
.sm\:w-auto{
width:auto
}
.sm\:w-full{
width:100%
}
.sm\:flex-1{
flex:1 1 0%
}
.sm\:grid-cols-2{
grid-template-columns:repeat(2,minmax(0,1fr))
}
.sm\:grid-cols-3{
grid-template-columns:repeat(3,minmax(0,1fr))
}
.sm\:justify-start{
justify-content:flex-start
}
.sm\:justify-unset{
justify-content:unset
}
.sm\:gap-7{
gap:1.75rem
}
.sm\:gap-8{
gap:2rem
}
.sm\:gap-12{
gap:3rem
}
.sm\:bg-white\/10{
background-color:#ffffff1a
}
.sm\:p-8{
padding:2rem
}
.sm\:px-8{
padding-left:2rem;
padding-right:2rem
}
.sm\:text-left{
text-align:left
}
.sm\:text-right{
text-align:right
}
.sm\:text-2xl{
font-size:1.5rem;
line-height:2rem
}
.sm\:text-3xl{
font-size:1.875rem;
line-height:2.25rem
}
.sm\:text-4xl{
font-size:2.25rem;
line-height:2.5rem
}
.sm\:text-sm{
font-size:.875rem;
line-height:1.25rem
}
.sm\:pl-5{
padding-left:1.25rem
}
.sm\:pl-16{
padding-left:4rem
}
.sm\:ws-nw{
white-space: nowrap;
}
}
@media (min-width: 768px){
.md\:left-1\/2{
left:50%
}
.md\:order-3{
order:3
}
.md\:col-span-2{
grid-column:span 2 / span 2
}
.md\:mx-4{
margin-left:1rem;
margin-right:1rem
}
.md\:ml-auto{
margin-left:auto
}
.md\:flex{
display:flex
}
.md\:hidden{
display:none
}
.md\:w-auto{
width: auto;
}
.md\:w-1\/4{
width:25%
}
.md\:max-w-\[280px\]{
max-width:280px
}
.md\:-translate-x-1\/2{
--tw-translate-x: -50%;
transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))
}
.md\:grid-cols-2{
grid-template-columns:repeat(2,minmax(0,1fr))
}
.md\:grid-cols-3{
grid-template-columns:repeat(3,minmax(0,1fr))
}
.md\:grid-cols-4{
grid-template-columns:repeat(4,minmax(0,1fr))
}
.md\:flex-row{
flex-direction:row
}
.md\:rounded-3xl{
border-radius:1.5rem
}
.md\:p-8{
padding:2rem
}
.md\:text-2xl{
font-size:1.5rem;
line-height:2rem
}
.md\:text-lg{
font-size:1.125rem;
line-height:1.75rem
}
}
@media (min-width: 1024px){
.lg\:sticky{
position:sticky
}
.lg\:-inset-x-0{
left:-0px;
right:-0px
}
.lg\:-top-20{
top:-5rem
}
.lg\:order-1{
order:1
}
.lg\:basis-50{
flex-basis:45%;
}
.lg\:order-2{
order:2
}
.lg\:order-3{
order:3
}
.lg\:order-none{
order:0
}
.lg\:col-span-2{
grid-column:span 2 / span 2
}
.lg\:mx-0{
margin-left:0;
margin-right:0
}
.lg\:ml-28{
margin-left:7rem
}
.lg\:ml-auto{
margin-left:auto
}
.lg\:mr-0{
margin-right:0
}
.lg\:mt-0{
margin-top:0
}
.lg\:mt-0\.5{
margin-top:.125rem
}
.lg\:mt-2{
margin-top:.5rem
}
.lg\:mt-3{
margin-top:.75rem
}
.lg\:block{
display:block
}
.lg\:flex{
display:flex
}
.lg\:hidden{
display:none
}
.lg\:h-36{
height:9rem
}
.lg\:w-1\/4{
width:25%
}
.lg\:w-36{
width:9rem
}
.lg\:w-auto{
width:auto
}
.lg\:flex-1{
flex:1 1 0%
}
.lg\:grid-cols-2{
grid-template-columns:repeat(2,minmax(0,1fr))
}
.lg\:grid-cols-3{
grid-template-columns:repeat(3,minmax(0,1fr))
}
.lg\:grid-cols-4{
grid-template-columns:repeat(4,minmax(0,1fr))
}
.lg\:flex-row{
flex-direction:row
}
.lg\:flex-col{
flex-direction:column
}
.lg\:items-start{
align-items:flex-start
}
.lg\:justify-start{
justify-content:flex-start
}
.lg\:gap-12{
gap:3rem
}
.lg\:rounded-3xl{
border-radius:1.5rem
}
.lg\:border-b{
border-bottom-width:1px
}
.lg\:bg-transparent{
background-color:transparent
}
.lg\:p-12{
padding:3rem
}
.lg\:px-4{
padding-left:1rem;
padding-right:1rem
}
.lg\:py-3{
padding-top:.75rem;
padding-bottom:.75rem
}
.lg\:pb-14{
padding-bottom:3.5rem
}
.lg\:text-left{
text-align:left
}
.lg\:text-3xl{
font-size:1.875rem;
line-height:2.25rem
}
.lg\:text-lg{
font-size:1.125rem;
line-height:1.75rem
}
.lg\:text-sm{
font-size:.875rem;
line-height:1.25rem
}
}
@media (min-width: 1280px){
.xl\:order-1{
order:1
}
.xl\:order-2{
order:2
}
.xl\:m-0{
margin:0
}
.xl\:basis-36{
flex-basis: 36%;
}
.xl\:-mx-12{
margin-left:-3rem;
margin-right:-3rem
}
.xl\:mb-1{
margin-bottom:.25rem
}
.xl\:mb-1\.5{
margin-bottom:.375rem
}
.xl\:mb-6{
margin-bottom:1.5rem
}
.xl\:ml-40{
margin-left:10rem
}
.xl\:ml-9{
margin-left:2.25rem
}
.xl\:ml-auto{
margin-left:auto
}
.xl\:mt-12{
margin-top:3rem
}
.xl\:mt-2{
margin-top:.5rem
}
.xl\:mt-4{
margin-top:1rem
}
.xl\:mt-8{
margin-top:2rem
}
.xl\:flex{
display:flex
}
.xl\:h-14{
height:3.5rem
}
.xl\:h-36{
height:9rem
}
.xl\:w-1\/2{
width:50%
}
.xl\:w-1\/3{
width:33.3%
}
.xl\:w-1\/4{
width:25%
}
.xl\:w-14{
width:3.5rem
}
.xl\:w-36{
width:9rem
}
.xl\:w-auto{
width:auto
}
.xl\:flex-initial{
flex:0 1 auto
}
.xl\:grid-cols-4{
grid-template-columns:repeat(4,minmax(0,1fr))
}
.xl\:grid-cols-5{
grid-template-columns:repeat(5,minmax(0,1fr))
}
.xl\:grid-cols-6{
grid-template-columns:repeat(6,minmax(0,1fr))
}
.xl\:flex-row{
flex-direction:row
}
.xl\:items-end{
align-items:flex-end
}
.xl\:gap-12{
gap:3rem
}
.xl\:gap-8{
gap:2rem
}
.xl\:border-0{
border-width:0px
}
.xl\:p-12{
padding:3rem
}
.xl\:px-12{
padding-left:3rem;
padding-right:3rem
}
.xl\:text-sm{
font-size:.875rem;
line-height:1.25rem
}
.xl\:text-xl{
font-size:1.25rem;
line-height:1.75rem
}
.xl\:state-gray:hover,.xl\:state-gray:focus{
background-color:#f1f1f11a
}
.xl\:hover\:ml-2:hover,.group:hover .xl\:group-hover\:ml-2{
margin-left:.5rem
}
.group:hover .xl\:group-hover\:border-0{
border-width:0px
}
.group:hover .xl\:group-hover\:pl-px{
padding-left:1px
}
}
@media (min-width: 1536px){
.\32xl\:gap-8{
gap:2rem
}
}
html::-webkit-scrollbar, .custom-scrollbar::-webkit-scrollbar {
width: 4px;
height: 4px;
}
html::-webkit-scrollbar-track, .custom-scrollbar::-webkit-scrollbar-track {
border-radius: 10px;
}
html::-webkit-scrollbar-thumb, .custom-scrollbar::-webkit-scrollbar-thumb {
border-radius: 10px;
-webkit-box-shadow: inset 0 0 6px #ccc;
background-color: #ccc;
}
html, .custom-scrollbar {
scrollbar-color: #ccc #fff;
scrollbar-width: thin;
}
.text-\[14px\]{
font-size:14px
}
.text-truncate{
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.imagezoom-container {
display: inline-block;
width: 100px;
height: 100px;
}
.imagezoom-container > input[type="checkbox"] {
display: none !important;
}
.imagezoom-container > label {
width: 100px;
height: 100px;
}
.imagezoom-container > input[type="checkbox"]:checked ~ label {
display: flex;
align-items: center;
justify-content: center;
position: fixed;
top: 0;
left: 0;
width: 100vw !important;
height: 100vh !important;
overflow: auto;
z-index: 1021;
background-color: rgba(0, 0, 0, 0.8);
}
.imagezoom-container .imagezoom {
object-fit: cover;
border: 0 none;
color: rgba(0, 0, 0, 0);
cursor: pointer;
width: inherit;
height: inherit;
border-radius: 5px;
transition: 0.3s;
}
.imagezoom-container .imagezoom:hover {
opacity: 0.7;
}
.imagezoom-container > input[type="checkbox"]:checked ~ label > .imagezoom:hover {
opacity: 1;
}
.imagezoom-container > input[type="checkbox"]:checked ~ label > .imagezoom {
position: fixed;
height: auto;
margin: auto;
max-width: 90%;
max-height: 95%;
height: auto;
width: auto;
z-index: 1022;
animation-name: zoom;
animation-duration: 0.5s;
}
@keyframes zoom {
from {transform:scale(0)}
to {transform:scale(1)}
}
.imagezoom-close {
display: none;
}
.imagezoom-container > input[type="checkbox"]:checked ~ label > .imagezoom-close {
display: block;
background: none;
border: 0 none;
color: #fff;
width: 30px;
height: 30px;
font-size: 30px;
position: fixed;
top: 20px;
right: 20px;
z-index: 1022;
cursor: pointer;
}
.imagezoom-container .popup {
display: none;
border-radius: 5px;
transition: 0.3s;
}
.imagezoom-container .popup:hover {
opacity: 0.7;
}
.imagezoom-container > input[type="checkbox"]:checked ~ label > .popup:hover {
opacity: 1;
}
.imagezoom-container > input[type="checkbox"]:checked ~ label > .popup {
height: auto;
margin: auto;
max-width: 90%;
max-height: 95%;
height: auto;
width: auto;
z-index: 1022;
animation-name: zoom;
animation-duration: 0.5s;
display: block;
}
.popup-container > label {
display: none;
}
.popup-container {
position: absolute;
}
.popup-link-itm {
word-break: break-all;
margin-bottom: 8px;
}
.hosts-notification {
background: #fff;
min-width: 250px;
overflow-y: auto;
padding: 1rem;
}
.ws-pl{
white-space: pre-line;
word-break: break-word;
}
.align-bottom{
vertical-align: bottom
}
.comment-wrapper > input[type="checkbox"] {
display: none;
}
.comment-wrapper .reply-form {
transform: scale(0.75) translateY(-50px);
max-height: 0;
opacity: 0;
overflow: hidden;
transition: all 0.2s cubic-bezier(0.5, 0, 0, 1.25), opacity 0.15s ease-out;
padding: 0;
}
.comment-wrapper > input[type="checkbox"]:checked ~ .reply-form {
max-height: 999px;
opacity: 1;
transform: scale(1) translateY(0);
padding: 0.5rem;
margin-bottom: 0.75rem;
}
#captcha-img{
border-radius: 15px;
border: 1px solid #d6d6d6;
}
.user-menu-dd {
position: relative;
display: inline-block;
user-select: none;
}
.user-menu-dd > input[type="checkbox"] {
position: absolute;
left: -100vw;
display: none;
}
.user-menu-dd > label {
display: flex;
cursor: pointer;
margin-bottom: 0;
}
.user-menu-dd > ul {
position: absolute;
z-index: 999;
display: none;
left: 100vw;
top: 30px;
border: 1px solid #c0c0c0;
background: #fff;
padding: 6px 0;
margin: 0;
list-style: none;
width: 160px;
border-radius: 3px;
box-shadow: 0 3px 8px rgba(0,0,0,.15);
}
.user-menu-dd > ul a {
display: block;
padding: 6px 15px;
text-decoration: none;
color: rgb(15,15,15);
}
.user-menu-dd > ul a:hover,
.user-menu-dd > ul a:focus {
background: #ececec;
}
.user-menu-dd input[type="checkbox"]:checked ~ ul,
.user-menu-dd > ul:target {
left: -50px;
display: block;
top: 35px;
}
@media (max-width: 575px) {
.user-menu-dd > input[type="checkbox"]:checked ~ ul,
.user-menu-dd > ul:target {
left: -100px;
}
}
/*Header dropdown Menu*/
.dd-menu > ul.hb-dropdown {
background: #ffffff;
opacity: 0;
padding: 5px 0;
position: absolute;
top: 100%;
transform: scaleY(0);
transform-origin: 0 0 0;
visibility: hidden;
transition: all 0.3s ease-in-out 0s;
box-shadow: 0 1px 2px 2px rgba(0,0,0,0.2);
width: 230px;
z-index: 99;
border-radius: 3px;
margin: 0;
list-style: none;
}
.dd-menu:hover > ul.hb-dropdown {
opacity: 1;
transform: scaleY(1);
visibility: visible;
top: 90%;
z-index: 100;
}
.dd-menu > ul.hb-dropdown > li:hover,
.dd-menu > ul.hb-dropdown > li > a:hover {
--tw-text-opacity: 1;
color:rgb(70 54 255 / var(--tw-text-opacity))
}
.dd-menu > ul.hb-dropdown > li {
position: relative;
transition: all 0.3s ease-in-out;
display: flex;
align-items: center;
justify-content: space-between;
padding: 6px 15px;
}
.dd-menu > ul.hb-dropdown > li > a {
display: block;
transition: all 0.3s ease-in-out 0s;
}
/*Header Sub dropdown Menu*/
.dd-menu > ul > li > ul.hb-sub-dropdown {
left: 100%;
position: absolute;
background: #fff;
width: 250px;
opacity: 0;
visibility: hidden;
box-shadow: 0 1px 2px 2px rgba(0,0,0,0.2);
top: 100%;
transition: all 0.3s ease-in-out;
list-style: none;
padding-inline-start: 0;
}
.dd-menu > ul > li:hover > ul.hb-sub-dropdown {
opacity: 1;
visibility: visible;
top: 0;
}
.dd-menu > ul.hb-dropdown > li.sub-dropdown-holder::after {
content: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='m13.28 5.967-4.347 4.346a1.324 1.324 0 0 1-1.867 0L2.72 5.967' stroke='%234636FF' fill='none' stroke-width='1.5'/></svg>");
transition: all 0.3s ease-in-out;
width: 16px;
}
.dd-menu > ul.hb-dropdown > li.sub-dropdown-holder:hover::after {
transform: rotate(-90deg);
}
.dd-menu > ul.hb-dropdown > li.sub-dropdown-holder > ul > li:hover,
.dd-menu > ul.hb-dropdown > li.sub-dropdown-holder > ul > li > a:hover{
--tw-text-opacity: 1;
color:rgb(70 54 255 / var(--tw-text-opacity))
}
.dd-menu > ul.hb-dropdown > li.sub-dropdown-holder > ul {
padding: 5px 0;
}
.dd-menu > ul.hb-dropdown > li.sub-dropdown-holder > ul > li {
padding: 6px 15px;
}
.ws-nw{
white-space: nowrap;
}
.p-\[20px\]{
padding:20px
}
.messages-container {
max-height: 450px;
overflow-y: scroll;
display: flex;
padding-top: 10px;
flex-direction: column-reverse;
}
.w-\[40px\]{
width: 40px
}
.w-\[100px\]{
width:100px
}
.w-\[600px\]{
width:600px
}
.h-\[40px\]{
height: 40px
}
.bg-blue {
--tw-bg-opacity: 1;
background-color:rgb(70 54 255 / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color:rgb(255 255 255 / var(--tw-text-opacity))
}
.bg-light {
--tw-bg-opacity: 1;
background-color:rgb(255 255 255 / var(--tw-bg-opacity));
--tw-text-opacity: 1;
color:rgb(70 54 255 / var(--tw-text-opacity))
}
.border-blue {
--tw-border-opacity: 1;
border-color:rgb(70 54 255 / var(--tw-border-opacity))
}
tr.text-center > td, tr.text-center > th {
text-align: center;
}
#product-gallery {
margin: 0 auto;
position: relative;
width: 275px;
height: 275px;
user-select: none;
background-color: #fff;
/* box-shadow: 0 6px 11px rgba(0, 0, 0, 0.2), 0 4px 4px rgba(0, 0, 0, 0.24); */
border-radius: 5px;
}
#product-gallery input {
display: none;
}
#product-gallery .slide_img {
position: absolute;
width: 100%;
height: 100%;
z-index: -1;
}
#product-gallery .slide_img img {
width: inherit;
height: inherit;
}
#product-gallery .slide_img .prev, #product-gallery .slide_img .next {
width: 10%;
height: inherit;
position: absolute;
top: 0;
background-color: rgba(0, 0, 0, 0.05);
z-index: 99;
transition: 0.45s;
cursor: pointer;
text-align: center;
opacity: 0;
}
#product-gallery .slide_img .next {
right: 0;
border-top-right-radius: 1.5rem;
border-bottom-right-radius: 1.5rem;
}
#product-gallery .slide_img .prev {
left: 0;
border-top-left-radius: 1.5rem;
border-bottom-left-radius: 1.5rem;
}
#product-gallery .slide_img:hover .prev, #product-gallery .slide_img:hover .next {
transition: 0.3s;
background-color: rgba(0, 0, 0, 0.15);
opacity: 1;
}
#product-gallery .slide_img .prev span, #product-gallery .slide_img .next span {
position: absolute;
width: 0px;
height: 0px;
border: solid 5px;
top: 50%;
transform: translateY(-50%);
}
#product-gallery .slide_img .prev span {
border-color: transparent #fff transparent transparent;
right: 35%;
}
#product-gallery .slide_img .next span {
border-color: transparent transparent transparent #fff;
left: 35%;
}
.gallery-wrapper #nav_slide {
width: 100%;
text-align: center;
z-index: 99;
cursor: default;
margin-top: 10px;
}
.gallery-wrapper #nav_slide .dots {
top: -5px;
width: 12px;
height: 12px;
margin: 0 3px;
position: relative;
border-radius: 100%;
display: inline-block;
background-color: rgba(0, 0, 0, 0.6);
transition: 0.4s;
cursor: pointer;
}
.gallery-wrapper #nav_slide .miniature {
margin-bottom: 0;
border-radius: 5px;
cursor: pointer;
border: 1px solid #eaeaea;
}
.gallery-wrapper #nav_slide .miniature > img {
border-radius: 5px;
}
#product-gallery #i1:checked ~ #img-1,
#product-gallery #i2:checked ~ #img-2,
#product-gallery #i3:checked ~ #img-3 {
z-index: 9;
animation: scroll 0.3s ease-in-out;
}
@keyframes scroll {
0% {
opacity: 0.4;
}
100% {
opacity: 1;
}
}
@media screen and (max-width: 685px) {
#product-gallery {
border: none;
width: 275px;
height: 275px;
}
#product-gallery .slide_img .prev, #product-gallery .slide_img .next {
width: 12%;
}
#product-gallery .slide_img .prev span, #product-gallery .slide_img .next span {
border: solid 10px;
}
#product-gallery .slide_img .prev span {
border-color: transparent #fff transparent transparent;
}
#product-gallery .slide_img .next span {
border-color: transparent transparent transparent #fff;
}
.gallery-wrapper #nav_slide .dots {
width: 12px;
height: 12px;
}
}
.product--description > input[type="checkbox"] {
display: none;
}
.product--description > .description--text {
overflow:hidden;
display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-line-clamp:3;
}
.product--description > input[type="checkbox"]:checked ~ .description--text {
-webkit-line-clamp:unset;
}
.product--description > label::before {
content: "развернуть";
}
.product--description > input[type="checkbox"]:checked ~ .description--text ~ label::before {
content: "свернуть";
}
.select-box {
position: relative;
display: block;
width: 160px;
font-size: 14px;
color: #242424;
border: solid 1px rgb(183 183 183);
clear: both;
cursor: pointer;
font-family: inherit;
border-radius: 30px;
padding: 3px 6px;
}
.select-box__current {
position: relative;
box-shadow: 0 15px 30px -10px rgba(0, 0, 0, 0.1);
cursor: pointer;
outline: none;
}
.select-box__current:focus + .select-box__list {
max-height: 999px;
opacity: 1;
transform: scale(1) translateY(0);
}
.select-box__current:focus + .select-box__list .select-box__option {
cursor: pointer;
}
.select-box__current:focus .select-box__icon {
transform: translateY(-50%) rotate(180deg);
}
.select-box__icon {
position: absolute;
top: 50%;
right: 15px;
transform: translateY(-50%);
width: 10px;
opacity: 0.6;
transition: 0.2s ease;
}
.select-box__value {
display: flex;
}
.select-box__input {
display: none;
}
.select-box__input:checked + .select-box__input-text {
display: block;
}
.select-box__input-text {
display: none;
width: 100%;
margin: 0;
padding: 5px 10px;
background-color: #fff;
height: 30px;
}
.select-box__no-input-text {
width: 100%;
margin: 0;
padding: 5px 10px;
background-color: #fff;
height: 30px;
}
.select-box__list {
transform: scale(0.75) translateY(-50px);
position: absolute;
top: 25px;
width: 100%;
padding: 0;
list-style: none;
max-height: 0;
opacity: 0;
overflow: hidden;
transition: all 0.2s cubic-bezier(0.5, 0, 0, 1.25), opacity 0.15s ease-out;
box-shadow: 0 0 0 1px rgb(68 68 68 / 11%);
transition-delay: 0.1s;
z-index: 999;
}
.select-box__option {
display: block;
background-color: #fff;
line-height: 30px;
min-height: 30px;
cursor: pointer;
font-weight: 400;
list-style: none;
outline: none;
padding-left: 18px;
padding-right: 29px;
text-align: left;
-webkit-transition: all 0.2s;
transition: all 0.2s;
margin: 0;
}
.select-box__option:hover, .select-box__option:focus {
color: #fff;
background-color: rgb(70, 54, 255);
}
.expandable > input[type="checkbox"] {
display: none;
}
.expandable > .content {
transform: scale(0.75) translateY(-50px);
max-height: 0;
opacity: 0;
overflow: hidden;
transition: all 0.2s cubic-bezier(0.5, 0, 0, 1.25), opacity 0.15s ease-out;
padding: 0;
}
.expandable > input[type="checkbox"]:checked ~ .content {
max-height: 999px;
opacity: 1;
transform: scale(1) translateY(0);
padding: 0.5rem;
margin-bottom: 0.75rem;
}
.star-cb-group {
/* remove inline-block whitespace */
font-size: 0;
/* flip the order so we can use the + and ~ combinators */
unicode-bidi: bidi-override;
direction: rtl;
/* the hidden clearer */
}
.star-cb-group * {
font-size: 1rem;
}
.star-cb-group > input {
display: none;
}
.star-cb-group > input + label {
/* only enough room for the star */
display: inline-block;
overflow: hidden;
text-indent: 9999px;
width: 1em;
white-space: nowrap;
cursor: pointer;
font-size: 22px;
}
.star-cb-group > input + label:before {
display: inline-block;
text-indent: -9999px;
content: "☆";
color: #888;
}
.star-cb-group > input:checked ~ label:before, .star-cb-group > input + label:hover ~ label:before, .star-cb-group > input + label:hover:before {
content: "★";
color: gold;
text-shadow: 0 0 1px #333;
}
.star-cb-group > .star-cb-clear + label {
text-indent: -9999px;
width: .5em;
margin-left: -.5em;
}
.star-cb-group > .star-cb-clear + label:before {
width: .5em;
}
.star-cb-group:hover > input + label:before {
content: "☆";
color: #888;
text-shadow: none;
}
.star-cb-group:hover > input + label:hover ~ label:before, .star-cb-group:hover > input + label:hover:before {
content: "★";
color: gold;
text-shadow: 0 0 1px #333;
}
.line-through {
text-decoration: line-through;
}
.max-w-full{
max-width:100%
}
#toggle-mobile-menu {
display: none;
}
#toggle-mobile-menu:checked ~ ul.mobile-menu {
display: grid!important;
}
details[open] summary.white,summary.white:hover,summary.white:focus{
--tw-text-opacity: 1;
color:rgb(244 244 244 / var(--tw-text-opacity))
}
details summary.white:after{
content:"";
margin-left:auto;
margin-top:.125rem;
height:1rem;
width:1rem;
background-image:url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.2797 5.96667L8.93306 10.3133C8.41973 10.8267 7.57973 10.8267 7.06639 10.3133L2.71973 5.96667' stroke='%23f4f4f4' stroke-width='1.5' stroke-miterlimit='10' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
background-repeat:no-repeat;
background-position:100% 65%;
transition-property:transform;
transition-timing-function:cubic-bezier(.4,0,.2,1);
transition-duration:.15s
}
.max-h-fullvh{
max-height: 100vh;
}
.overflow-y-scroll{
overflow-y: auto;
}
.number-cell {
width: 40px!important;
height: 40px!important;
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
/* padding: 25px; */
background-color: rgb(70 54 255);
border-radius: 10%;
margin-right: 0!important;
}
.number-cell:before {
display: none!important;
}
.number-cell:checked {
background-color: rgb(70 54 255);
outline: none;
}
.number-cell ~ label {
color: rgb(70 54 255);;
}
.number-cell:checked ~ label {
color: rgb(244 244 244);
}
.store-image{
height: 170px;
margin: auto;
}
.store-image-sm{
height: 150px;
margin: auto;
}
.product-image{
height: 160px;
margin: auto;
}
.tabs {
position: relative;
}
.tabs input[name=tab-control] {
display: none;
}
.tabs .content section h2,
.tabs > ul li label {
font-size: 16px;
color: rgb(70 54 255);
margin-bottom: 0;
}
.tabs > ul {
list-style-type: none;
padding-left: 0;
display: flex;
flex-direction: row;
margin-bottom: 10px;
align-items: flex-end;
flex-wrap: wrap;
}
.tabs > ul li {
box-sizing: border-box;
width: 185px;
padding: 0 10px;
text-align: center;
}
.tabs > ul li label {
transition: all 0.3s ease-in-out;
color: rgb(70 54 255);
padding: 5px auto;
overflow: hidden;
text-overflow: ellipsis;
display: block;
cursor: pointer;
transition: all 0.2s ease-in-out;
white-space: nowrap;
-webkit-touch-callout: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.tabs > ul li label br {
display: none;
}
.tabs > ul li label:hover, .tabs > ul li label:focus, .tabs > ul li label:active {
outline: 0;
color: rgb(70 54 255);
}
.tabs .slider {
position: relative;
width: 185px;
transition: all 0.33s cubic-bezier(0.38, 0.8, 0.32, 1.07);
}
.tabs .slider .indicator {
position: relative;
width: 50px;
max-width: 100%;
margin: 0 auto;
height: 4px;
background: rgb(70 54 255);
border-radius: 1px;
}
.tabs .content section {
display: none;
-webkit-animation-name: content;
animation-name: content;
-webkit-animation-direction: normal;
animation-direction: normal;
-webkit-animation-duration: 0.3s;
animation-duration: 0.3s;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
-webkit-animation-iteration-count: 1;
animation-iteration-count: 1;
line-height: 1.4;
}
.tabs .content section h2 {
color: rgb(70 54 255);
display: none;
}
.tabs .content section h2::after {
content: "";
position: relative;
display: block;
width: 30px;
height: 3px;
background: rgb(70 54 255);
margin-top: 5px;
left: 1px;
}
.tabs input[name=tab-control]:nth-of-type(1):checked ~ ul > li:nth-child(1) > label {
cursor: default;
color: rgb(70 54 255);
}
@media (max-width: 600px) {
.tabs input[name=tab-control]:nth-of-type(1):checked ~ ul > li:nth-child(1) > label {
background: rgba(0, 0, 0, 0.08);
}
}
.tabs input[name=tab-control]:nth-of-type(1):checked ~ .slider {
transform: translateX(0%);
}
.tabs input[name=tab-control]:nth-of-type(1):checked ~ .content > section:nth-child(1) {
display: grid;
}
.tabs input[name=tab-control]:nth-of-type(2):checked ~ ul > li:nth-child(2) > label {
cursor: default;
color: rgb(70 54 255);
}
@media (max-width: 600px) {
.tabs input[name=tab-control]:nth-of-type(2):checked ~ ul > li:nth-child(2) > label {
background: rgba(0, 0, 0, 0.08);
}
}
.tabs input[name=tab-control]:nth-of-type(2):checked ~ .slider {
transform: translateX(100%);
}
.tabs input[name=tab-control]:nth-of-type(2):checked ~ .content > section:nth-child(2) {
display: grid;
}
.tabs input[name=tab-control]:nth-of-type(3):checked ~ ul > li:nth-child(3) > label {
cursor: default;
color: rgb(70 54 255);
}
@media (max-width: 600px) {
.tabs input[name=tab-control]:nth-of-type(3):checked ~ ul > li:nth-child(3) > label {
background: rgba(0, 0, 0, 0.08);
}
}
.tabs input[name=tab-control]:nth-of-type(3):checked ~ .slider {
transform: translateX(200%);
}
.tabs input[name=tab-control]:nth-of-type(3):checked ~ .content > section:nth-child(3) {
display: grid;
}
@-webkit-keyframes content {
from {
opacity: 0;
transform: translateY(5%);
}
to {
opacity: 1;
transform: translateY(0%);
}
}
@keyframes content {
from {
opacity: 0;
transform: translateY(5%);
}
to {
opacity: 1;
transform: translateY(0%);
}
}
@media (max-width: 1000px) {
.tabs > ul li label {
white-space: initial;
}
.tabs > ul li label br {
display: initial;
}
}
@media (max-width: 600px) {
.tabs > ul li label {
padding: 5px;
border-radius: 5px;
}
.tabs > ul li {
width: fit-content;
}
.tabs .slider {
display: none;
}
.tabs .content {
margin-top: 20px;
}
.tabs .content section h2 {
display: block;
}
}
.vertical-text-bottom{
vertical-align: text-bottom;
}
.expandable--text > input[type="checkbox"] {
display: none;
}
.expandable--text > .content {
overflow:hidden;
display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-line-clamp:3;
}
.expandable--text > input[type="checkbox"]:checked ~ .content {
-webkit-line-clamp:unset;
}
.expandable--text > label::before {
content: "развернуть";
}
.expandable--text > input[type="checkbox"]:checked ~ .content ~ label::before {
content: "свернуть";
}
.slider {
text-align: center;
overflow: hidden;
}
.slides {
display: flex;
overflow-x: auto;
scroll-snap-type: x mandatory;
scroll-behavior: smooth;
-webkit-overflow-scrolling: touch;
}
.slides::-webkit-scrollbar {
width: 8px;
height: 8px;
}
.slides::-webkit-scrollbar-thumb {
background: #f0f0f0;
border-radius: 8px;
}
.slides::-webkit-scrollbar-track {
background: transparent;
}
.slides > div {
scroll-snap-align: start;
flex-shrink: 0;
/*width: 300px;
height: 300px;*/
margin-right: 50px;
border-radius: 10px;
transform-origin: center center;
transform: scale(1);
transition: transform 0.5s;
position: relative;
display: flex;
justify-content: space-between;
align-items: center;
}
.slides > div > div:nth-child(even) {
margin-right: 0px !important;
}
.ttip {
position: relative;
cursor: default;
}
.ttip .tooltiptext {
padding: 5px 7px;
visibility: hidden;
width: 150px;
background-color: black;
color: #fff;
text-align: center;
border-radius: 6px;
top: -8px;
right: 105%;
position: absolute;
z-index: 1;
opacity: 0;
transition: opacity 400ms;
pointer-events: none;
}
.ttip:hover .tooltiptext {
visibility: visible;
opacity: 1;
}
.ttip .textright {
left: 35px;
}
.max-h-\[60px\]{
max-height: 60px;
}
.position-unset {
position: unset;
}
@media (min-width: 431px) {
.searchbox{
width: 600px;
}
}
@media (min-width: 591px) {
.searchbox{
width: 100px;
order: unset;
}
}
.store-banner{
max-height: 185px;
}
@media (min-width: 1024px){
.store-banner{
max-height: 240px;
}
}
.b-none{
border: none;
}
.link-blue{
cursor:pointer;
border-color:rgb(183 183 183 / var(--tw-border-opacity));
--tw-text-opacity: 1;
color:rgb(47 47 47 / var(--tw-text-opacity))
}
.link-blue:not([aria-current=page]):focus,.link-blue:not([aria-current=page]):hover{
--tw-border-opacity: 1;
border-color:rgb(70 54 255 / var(--tw-border-opacity));
--tw-text-opacity: 1;
color:rgb(70 54 255 / var(--tw-text-opacity))
}
@media (min-width: 640px){
#stars-filler {
width: calc(100% / 5 * var(--rating)) !important;
}
}
.conic {
position: relative;
overflow: hidden;
}
.conic::before {
content: '';
position: absolute;
left: -50%;
top: -50%;
width: 200%;
height: 200%;
animation: rotate 8s linear infinite;
}
.conic-x::before {
background: conic-gradient(transparent 25%, #4dacff, #ff4d70 64%, transparent);
}
.conic-y::before {
background: conic-gradient(transparent 25%, mediumvioletred, gold 64%, transparent);
}
.conic-z::before {
background: conic-gradient(transparent 25%, white, orchid 64%, transparent);
}
.conic::after {
content: '';
position: absolute;
z-index: 0;
left: 2px;
top: 2px;
width: calc(100% - 4px);
height: calc(100% - 4px);
background: #fff;
border-radius: 16px;
}
@keyframes rotate {
100% {
transform: rotate(1turn);
}
}
.blured {
filter: blur(3px);
}