-
Notification
-
Dmitriy Groshev
Hi, i am josephin. How are you...
17:123 -
Sufiya Elija
I need job, Please help me.
Fri -
Janis Evans
Good Morning!
8:2212 -
Mukrani Pabelo
Hi, i am josephin. How are you...
03:1410 -
Josephin Water
You’ve got some kind of a stom...
Thu -
Janis Evans
Good Morning!
8:2212 -
Sufiya Elija
I need job, Please help me.
Fri
-
-
-
-
Cart Items (25)
-
Flower Pot
$25.00
-
Iphone Max pro
$35.20
-
Royal Party Glass
$45.10
-
Water Proof Watch
$12.30
-
Traveling Duffle Bag
$32.10
Proceed to CheckoutAdd Total
$250.00 -
-
-
-
English -
French -
Spanich -
Arabic
-
-
Helen Walter
Admin
Switch
<div class="flex justify-center gap-2">
<label class="inline-flex relative items-center cursor-pointer gap-1">
<input class="sr-only peer" type='checkbox' value='' checked=""/>
<div class="w-11 h-6 bg-content rounded-full peer peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-gray-light peer-checked:after:translate-x-full peer-checked:after:content-white after:content-[''] after:absolute after:top-[2px] after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-primary"></div>
<span class="text-sm font-medium text-light3">Default Switch</span>
<label>
</div>
<div class="flex justify-center gap-2">
<label class="inline-flex relative items-cente cu sor-pointer gap-1">
<input class="sr-only peer" type='checkbox' value='' checked="" disabled="disabled"/>
<div class="w-11 h-6 border-2 rounded-full peer peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-gray-light peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] ltr:after:left-[2px] rtl:after:right-[22px] after:bg-content after:border-gray-light after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:after:bg-primary peer-checked:border-primary"></div>
<span class="text-sm font-medium text-light3">Default outline</span>
<label>
</div>
<div class="flex justify-center gap-2">
<label class="inline-flex relative items-center cursor-pointer">
<input class="sr-only peer" type='checkbox' value='' checked="" disabled="disabled"/>
<div class="w-11 h-6 bg-content rounded-full peer peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-gray-light peer-checked:after:translate-x-full peer-checked:after:content-white after:content-'' after:absolute after:top- 2px after:left-'2px' after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-primary"></div>
<span class="text-sm font-medium text-light3">disabled outline</span>
<label>
</div>
<div class="flex justify-center flex-wrap gap-4">
<label class="inline-flex relative items-center cursor-pointer gap-1">
<input class="sr-only peer" type='checkbox' value='' disabled="disabled"/>
<div class="w-11 h-6 bg-content rounded-full peer peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-gray-light peer-checked:after:translate-x-full peer-checked:after:content-white after:content-'' after:absolute after:top- 2px after:left-'2px' after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-primary"></div>
<span class=" text-sm font-medium text-light3 ">disabled </span>
<label>
<label class="inline-flex relative items-center cursor-pointer gap-1">
<input class="sr-only peer" type='checkbox' value='' checked="" disabled="disabled"/>
<div class="w-11 h-6 bg-content rounded-full peer peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-gray-light peer-checked:after:translate-x-full peer-checked:after:content-white after:content-'' after:absolute after:top-2px after:left-2px after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-primary"></div>
<span class="text-sm font-medium text-light3">disabled </span>
<label>
</div>
<div class="flex justify-center flex-wrap gap-4">
<label class="inline-flex relative items-center cursor-pointer">
<input class="sr-only peer" type='checkbox' value='' checked="checked"/>
<div class="w-14 h-7 rounded-full border-2 peer peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-gray-light peer-checked:after:translate-x-full peer-checked:after:border-white after:content-'' after:absolute after:top-0.5 after:left-4px after:bg-content after:border-gray-light after:border after:rounded-full after:h-6 after:w-6 after:transition-all peer-checked:after:bg-primary peer-checked:border-primary "></div>
<span class="ml-3 text-sm font-medium text-light3><span>
</label>
<label class="inline-flex relative items-center cursor-pointer">
<input class="sr-only peer" type='checkbox' value='' checked="checked">
<div class="w-11 h-6 border-2 rounded-full peer peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-gray-light peer-checked:after:translate-x-full peer-checked:after:border-white after:content-'' after:absolute after:top-4px after:left-3px after:bg-content after:border-gray-light after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:after:bg-primary peer-checked:border-primary"></div>
<span class="ml-3 text-sm font-medium text-light3><span>
</label>
<label class="inline-flex relative items-center cursor-pointer">
<input class="sr-only peer" type='checkbox' value='' checked="checked">
<div class="w-9 h-5 border-2 rounded-full peer peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-gray-light peer-checked:after:translate-x-full peer-checked:after:border-white after:content-'' after:absolute after:top-6px after:left-2px after:bg-content after:border-gray-light after:border after:rounded-full after:h-4 after:w-4 after:transition-all peer-checked:after:bg-primary peer-checked:border-primary"></div>
<span class="ml-3 text-sm font-medium text-light3><span>
</label>
<label class="inline-flex relative items-center cursor-pointer">
<input class="sr-only peer" type='checkbox' value='' checked="checked">
<div class="w-7 h-4 border-2 rounded-full peer peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-gray-light peer-checked:after:translate-x-full peer-checked:after:border-white after:content-'' after:absolute after:top-8px after:left-2px after:bg-content after:border-gray-light after:border after:rounded-full after:h-3 after:w-3 after:transition-all peer-checked:after:bg-primary peer-checked:border-primary"></div>
<span class="ml-3 text-sm font-medium text-light3"></span>
</label>
</div>
<div class="flex justify-center flex-wrap gap-4">
<label class="inline-flex relative items-center cursor-pointer">
<input class="sr-only peer " type='checkbox' value='' checked="checked"/>
<div class="w-14 h-7 bg-content rounded-full peer peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-gray-light peer-checked:after:translate-x-full peer-checked:after:border-white after:content-'' after:absolute after:top-0.5 after:left-4px after:bg-white after:border-gray-light after:border after:rounded-full after:h-6 after:w-6 after:transition-all peer-checked:bg-primary"></div>
<span class="ml-3 text-sm font-medium text-light3><span>
</label>
<label class="inline-flex relative items-center cursor-pointer">
<input class="sr-only peer " type='checkbox' value='' checked="checked"/>
<div class="w-11 h-6 bg-content rounded-full peer peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-gray-light peer-checked:after:translate-x-full peer-checked:after:border-white after:content-'' after:absolute after:top-4px after:left-3px after:bg-white after:border-gray-light after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-primary"></div>
<span class="ml-3 text-sm font-medium text-light3><span>
</label>
<label class="inline-flex relative items-center cursor-pointer">
<input class="sr-only peer " type='checkbox' value='' checked="checked"/>
<div class="w-9 h-5 bg-content rounded-full peer peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-gray-light peer-checked:after:translate-x-full peer-checked:after:border-white after:content-'' after:absolute after:top-6px after:left-2px after:bg-white after:border-gray-light after:border after:rounded-full after:h-4 after:w-4 after:transition-all peer-checked:bg-primary"></div>
<span class="ml-3 text-sm font-medium text-light3><span>
</label>
<label class="inline-flex relative items-center cursor-pointer">
<input class="sr-only peer " type='checkbox' value='' checked="checked"/>
<div class="w-7 h-4 bg-content rounded-full peer peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-gray-light peer-checked:after:translate-x-full peer-checked:after:border-white after:content-'' after:absolute after:top-8px after:left-2px after:bg-white after:border-gray-light after:border after:rounded-full after:h-3 after:w-3 after:transition-all peer-checked:bg-primary">
<span class="ml-3 text-sm font-medium text-light3"></span>
</label>
</div>
<div class="flex justify-center gap-4 flex-wrap">
<label class="inline-flex relative items-center cursor-pointer">
<input class="sr-only peer" type='checkbox' value='' checked=""/>
<div class="w-11 h-6 bg-content rounded-full peer peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-gray-light peer-checked:after:translate-x-full peer-checked:after:content-white after:content-'' after:absolute after:top-2px after:left-2px after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-primary"></div>
<span class="text-sm font-medium text-light3 ">primary</span>
<label>
<label class="inline-flex relative items-center cursor-pointer">
<input class="sr-only peer" type='checkbox' value='' checked=""/>
<div class="w-11 h-6 bg-content rounded-fullpeer peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-gray-light peer-checked:after:translate-x-full peer-checked:after:content-white after:content-'' after:absolute after:top-2px after:left-2px after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-secondary"></div>
<span class="text-sm font-medium text-light3 ">secondary</span>
<label>
<label class="inline-flex relative items-center cursor-pointer">
<input class="sr-only peer" type='checkbox' value='' checked=""/>
<div class="w-11 h-6 bg-content rounded-full peer peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-gray-light peer-checked:after:translate-x-full peer-checked:after:content-white after:content-'' after:absolute after:top- 2px after:left-'2px' after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-warning"></div>
<span class="text-sm font-medium text-light3 ">warning</span>
<label>
<label class="inline-flex relative items-center cursor-pointer">
<input class="sr-only peer" type='checkbox' value='' checked=""/>
<div class="w-11 h-6 bg-content rounded-full peer peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-gray-light peer-checked:after:translate-x-full peer-checked:after:content-white after:content-'' after:absolute after:top-2px after:left-2px after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-success"></div>
<span class="text-sm font-medium text-light3 ">success</span>
<label>
</div>
<div class="flex justify-center gap-4">
<label class="inline-flex relative items-center cursor-pointer">
<input class="sr-only peer" type='checkbox' value='' checked=""/>
<div class="w-11 h-6 border-2 rounded-full peer peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-gray-light peer-checked:after:translate-x-full peer-checked:after:border-white after:content-'' after:absolute after:top-2px after:left-2px after:bg-content after:border-gray-light after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:after:bg-primary peer-checked:border-primary"></div>
<span class="text-sm font-medium text-light3 ">primary</span>
<label>
<label class="inline-flex relative items-center cursor-pointer">
<input class="sr-only peer" type='checkbox' value=''/>
<div class="w-11 h-6 border-2 rounded-full peer peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-gray-light peer-checked:after:translate-x-full peer-checked:after:border-white after:content-'' after:absolute after:top-2px after:left-2px after:bg-content after:border-gray-light after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:after:bg-secondary peer-checked:border-secondary"></div>
<span class="text-sm font-medium text-light3 ">secondary</span>
<label>
<label class="inline-flex relative items-center cursor-pointer">
<input class="sr-only peer" type='checkbox' value='' checked=""/>
<div class="w-11 h-6 border-2 rounded-full peer peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-gray-light peer-checked:after:translate-x-full peer-checked:after:border-white after:content-'' after:absolute after:top-2px after:left-2px after:bg-content after:border-gray-light after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:after:bg-warning peer-checked:border-waring></div>
<span class="text-sm font-medium text-light3 ">warning</span>
<label>
<label class="inline-flex relative items-center cursor-pointer">
<input class="sr-only peer" type='checkbox' value=''/>
<div class="w-11 h-6 border-2 rounded-full peer peer-focus:outline-none peer-focus:ring-4 peer-focus:ring-gray-light peer-checked:after:translate-x-full peer-checked:after:border-white after:content-'' after:absolute after:top-2px after:left-2px after:bg-content after:border-gray-light after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:after:bg-success peer-checked:border-success"></div>
<span class="text-sm font-medium text-light3 ">success</span>
<label>
</div>