@font-face { font-family: fontone; src: url(../FONTS/Urbanist.ttf);}
@font-face { font-family: fonttwo; src: url(../FONTS/zacbelx-medium.ttf);}
@font-face { font-family: fontthree; src: url(../FONTS/BDOGrotesk-Regular.ttf);}

* {
overflow: hidden; box-sizing: border-box; text-decoration: none; background-color: transparent; border: none;
padding: 0%; margin: 0%; font-family: fontone; font-weight: 590;
}
button:active {
transform: scale(.97);
}
html {
font-size: 16px; 
}
body {
width: 100vw; overflow-y: auto; height: 100vh; background-color: #FFFFFF !important; scroll-behavior: smooth;
}
#slidesearchput:focus {
border: solid 1px #F1F4F5 !important;
}
input:focus, textarea:focus{
outline: none !important;
border: solid 1.2px #000000 !important;
}
/* cookie box styling */
.cookiepolbox {
width: 100%; height: max-content; padding: 20px 10px 20px 10px; background-color: #046144;
}
.cookiepolbox span {
font-size: .9rem; color: #FFFFFF; width:100%; text-align: center; 
}
.cookiepolbox span a{
font-size: .9rem; color: #FFFFFF !important; text-decoration: underline;
}
/* header styling start here */
header {
width: 100vw; height: 55px;display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #F1F4F5;
z-index: 999999; background-color: #FFFFFF;  padding: 5px 10px 5px 10px; position: fixed;
}
.jumpbtn {
margin-left: 13px;
}
#jumpbox {
width: max-content; height: 32px; display: flex; align-items: center; overflow: visible;
}
.jumplnk ,.jumpbtn,.viewbagtop{
height: 32px; width: 32px;  display: flex; justify-content: center; align-items: center; justify-content: center;
}
.jumplnk {
margin-left: 2px;
}
#menubtn {
margin-left: 0%;
}
.viewbagtop img ,.jumplnk img , .jumpbtn img {
height: 88%; width: auto;
}
.viewbagtop {
margin-right: 10px;
}
#accountsjump  {
padding-right: 5px;
}
#accountsjump img{
height: 78%;
}
#bagjump {
overflow: visible; position: relative; padding-bottom: 2px;
}
#bagjump img {
height: 76%;
}
#headerbagcount {
position: absolute; top: -19%; padding: 2px; width:15px; height: 15px;  background-color: #FAFAFA; right: -30%; color: #000000 !important; border: 1px #F1F4F5 solid;
border-radius: 100%; font-size: .7rem; display: flex; justify-content: center; align-items: center;  margin-top: 2px; z-index: 9999; box-shadow: 0px 2px 8px #E4E6E9;
}

.headertop {
height: 90%; width: max-content; display: flex; align-items: center; padding: 8px; padding-left: 0px;
}
.headertop h3 {
color: #000000; font-size: .9rem;
}
#headertoplnk {
width: 32px; height: 32px; margin-right: 6px; border-radius: 10px; border: #000000 solid 2px; display: flex; justify-content: center; align-items: center;
}
#headertoplnk img{
height: 100%; width: auto; border-radius: 10px;
}
.headermidbox {
width: max-content; height: max-content; display: flex; align-items: center; justify-content: center;
}
.headermidboxlnk {
font-size: 1rem; font-weight: 500; color: #000000 !important; margin-right: 20px;
}
.collbag {
margin-right: 11px;
}


/*main styling */
main {
width: 100vw; height: max-content; padding: 10px; padding-top: 55px;
}

#categorscroll a {
padding: 10px 20px 10px 20px; width: max-content; height: max-content; color: #000000 !important;border-radius: 30px; display: flex; 
justify-content: center; align-items: center; font-size: 1rem; margin: 0px 10px 10px 0px;
}

/*bottom styling */

.bottomcont {
width: 100vw; height:max-content; display: flex;flex-wrap: wrap; flex-direction: row; background: #E4E6E9; padding: 30px 10px 20px 10px; align-items: flex-start;
}
.bottomcontbox {
width: max-content; height: max-content; display: flex; flex-direction: column; margin-right: 50px; margin-bottom: 12px;
}
.bottomcontbox h4 {
color: 1.3rem; width: 100%; color: #000000; padding-bottom: 15px; font-weight: 600;
}
.viewbottom {
padding-bottom: 20px;
}
#bottomclk{
width: max-content; padding-bottom:12px; color: #000000 !important; font-size: .9rem; font-weight: 500;
}
.bottompaytrick {
display: flex; align-items: center; justify-content: center; width: 100%; height: 30px;margin-bottom: 30px;
}
.bottompaytrick img{
margin-right: 10px; width: auto; height: 100%;
}
.bottomsocialbox {
width: 100%; height: max-content; padding-top: 12px; display: flex; flex-wrap: wrap; align-items: center;
}
.bottomsocial {
height: 30px; padding: 2px; width: max-content; display: flex; align-items: center; justify-content: center; padding-right: 10px;
}
.bottomsocial img {
height: 98%; width: auto; 
}
.payngs {
height: 55% !important;
}

#pyrexanchdiv {
width: 100%; background-color: #000000;  padding: 10px; display: flex; justify-content: center; height: max-content;
}

#pyrexanchdiv a {
color: #FFFFFF !important; width: max-content; height: max-content; font-size: .8rem;
}
#pyrexanchdiv a span {
text-decoration: underline;
}
 
/* slide styling */
.menuslide {
width: 70%; height: 100%; background-color: #FFFFFF; background-size: auto 100%; z-index: 99999; 
position: fixed; top: 0%; left: 0%; overflow-y: auto; max-width: 420px; padding-top: 56px;
}

.slidextop {
width: 100%; height: 40px; display: flex; align-items: center; justify-content: flex-end; background-color: #000000;
margin-bottom: 50px;
}
.slidextop button {
width: 60px; height: 100%; z-index: 9; display: flex; justify-content: center; align-items: center;
}
.slidextop button img {
height: 90%; width: auto; 
}

.slidesearchbox {
width: 100%; height: 50px; position: relative;  border-bottom: 1px solid #F1F4F5; margin-bottom: 10px;
}
#slidesearchform {
width: 100%; height: 100%; display: flex;align-items: center; 
}
#slidesearchput {
height: 100%; width: 100%; font-size: .8rem; padding: 5px 62px 5px 10px; background-color: #FAFAFA;
border: solid 1px #F1F4F5;

}
#slidesearchput:focus {
border: solid #000000 2px !important; background-color: #FAF1F5;
}
#slideseachbtn {
width: 60px; height:100%; position: absolute; right: 0%; display: flex; align-items: center; justify-content: center; background-color: #000000;
}
#slideseachbtn img {
height: 60%; width: auto;
}

.slideboxone {
width: 100%; height: max-content; display: flex; flex-wrap: wrap; align-items: center; border-bottom: 4px solid #F1F4F5;
}

.slideboxonelink {
width: 50%; height: 60px; display: flex; align-items: center; justify-content: center; border-bottom:1px solid #F1F4F5;color: #000000 !important;
padding: 10px;  background-position: 0%; background-size: 100% auto;
}
.sbolone {
border-right:1px solid #F1F4F5;
}
.slideboxonelink img {
height: 100%; width: auto;
}
.slideintrotext {
width: 100%;font-size: 1.2rem; padding: 10px; color: #000000;
}
.sbolfirst {
border-top:1px solid #F1F4F5;
}
.slideboxone span {
color: #FFFFFF !important; font-size: 2rem; font-weight: 650; width: 100%;
}

.slideboxtwo { 
width: 100%; height: max-content; display: flex; flex-direction: column;
}
.slideboxtwolink {
width: 100%; padding: 10px; border-bottom:1px solid #F1F4F5; color: #000000 !important; height: 45px; display: flex; align-items: center;
font-size: 1rem; font-weight: 600;
}
.slideboxthree {
width: 100%; height: max-content; padding: 10px; display: flex; align-items: center;
}
.slideboxthreelink {
width: 50px; height: 50px; display: flex; align-items: center; justify-content: center;
}
.slideboxthreelink img {
height: 90%; width: auto;
}


/* nav styling  */
nav {
width: 100vw; height: 45px; background-color: #FFFFFF; border-top: solid #FAFAFA 1px; position: fixed; bottom: 0%; 
left: 0%; display: flex; justify-content: space-between; align-items: center; z-index: 99;
}
.navclk {
width: 19%; height: 100%; position: relative; display: flex; justify-content: center; align-items: center;
}
.navlnk {
position: absolute; top: 0%; left: 0%; height: 100%; width: 100%; z-index: 9;
}
.navclk img {
height: 56%; width: auto;
}
#navbag {
position: relative;
}
.mainnoticount,#navbagcount {
font-size: .7rem; position: absolute; top: 5%; right: 6%; width: 16px; height: 16px; border-radius: 100%;
display: flex; justify-content: center; align-items: center;
}
#navbagcount {
box-shadow: 0px 2px 4px #808080; background-color: #FAFAFA; color: #000000 !important;
}

.mainnoticount {
background-color: #0052FF; color: #FFFFFF !important;
}
/* collection styling */
#shopmain {
border-top: none; min-height: 95vh;
}

.shopmainsect {
width: 100%; height: max-content;
}
.catalogtop {
width: 100%; height: max-content; display: flex; align-items: center; padding: 10px; background-color: #F1F4F5; margin-bottom: 10px;
}
.catalogtopbtn {
width: max-content; height: max-content; font-size: 1rem; margin-right: 10px; font-weight: 620; color: #808080;
}
#maincatbtn {
text-decoration: underline; color: #000000;
}
.catologcont {
width: 100%; height: max-content; display: flex; flex-wrap: wrap; border-bottom: 1px solid #F1F4F5; border-left: 1px solid #F1F4F5; justify-content: flex-start; align-items: center;
}
.catologbox {
width: 33%; height: 150px; border-right: 1px solid #F1F4F5; border-top: 1px solid #F1F4F5; display: flex; flex-direction: column; align-items: center; justify-content: center;
padding: 10px;
}
.catologbox img {
width: 50px; height: auto; margin-bottom: 20px;
}
.catologbox p {
font-size: 1rem; text-align: center; color: #000000 !important; 
}

.collbaglnk {
margin-right: 8px;
}

#categoryscrollbox {
width: 100%; height: max-content;  margin-top: 10px; overflow-x: auto;
}
#categorscroll {
width: max-content; height: 100%; display: flex; flex-wrap: wrap; align-items: center; margin-bottom: 20px;
}
#categoryscrollbox::-webkit-scrollbar {
display: none;
}
#categorscroll a {
margin: 0px 5px 5px 0px; background-color: #FFFFFF; border: #DFE3EB solid 1px; padding: 8px 18px 8px 18px;
}
#categorscroll a:hover,#maincategorybox a:hover {
border: solid 1px #000000;
}
.collectionbox {
width: 100%; height: max-content;  display: flex; flex-wrap: wrap;
}
#searchgrabcount {
width: 100%; font-size: .9rem; margin-bottom: 15px;
}
#searchgrabcount span {
color: #808080;
}
#activcategory {
border: solid 1px #000000 !important; background-color: transparent !important;
}
.cat-all {
order: -2 !important;
}

/* item styling */
.collectionbox,#main-screenthree {
justify-content: space-between; width: 100%;
}
.itembox {
width: 48%; position: relative;  margin-bottom: 5%; padding: 8px; display: flex; flex-direction: column; background-color: #FFFFFF;
justify-content: center; align-items: center;  height: 74vw; border: 1px #E4E6E9 solid;
}

.outstockbox {
position: absolute; top: 0%; left: 0%; width: 100%; height: 100%; z-index: 99;display: flex; align-items: center; justify-content: center;
}
.outstockboxtest {
padding: 4px 10px 4px 10px; font-size: .8rem; background-color: #000000; border-radius: 16px; height: max-content; width: max-content; color: #FFFFFF;
}

#itemboxlnk {
position: absolute; top: 0%; left: 0%; width: 100%; height: 98%; z-index: 99;
}

#itemboxlnk:hover {
background-color: #FFFFFF; opacity: .15;
}
.itembox img{
width: 100%; height: auto; background-color: #FAFAFA;
}
.itemname {
width: 100%; height: max-content; font-size: 1rem; font-weight: 700; padding-bottom: 4px; color: #001428;
}

.tagbox {
width: 100%; height: 30px;  display:flex; justify-content: flex-end; align-items: center;
top: 0%; z-index: 9; left: 0%; background-color: transparent; position: absolute; padding: 6px;
}
.tagcont {
width: max-content; height: max-content; padding: 4px; background-color: #000000; color: #000000; font-size: .6rem;
text-align: center; border-radius: 3px; 
}
.tagdrop {
background-color: #EDF3EC; margin-right: 5px; border: #71875D solid 1px; 
}
.tagnew {
background-color: #F1F1F1; border: #000000 solid 1px; 
}

#finadealprice {
color: #000000; font-size: .9rem; height: max-content; padding-bottom: 2px;width: 100%; font-weight: 600; font-family: fonttwo;
}
#itemdealprice {
text-decoration: line-through; margin-right: 6px; font-size: .8rem; text-decoration-thickness: 1px; color: #BAC0C6; font-family: fonttwo;
text-decoration-thickness: 1px; height: max-content; padding-bottom: 2px; width: 100%;font-size: .9rem; font-weight: 600;
}
#itemshowprice {
font-size: .8rem; color: #000000 !important; height: max-content; padding-bottom: 2px; width: 100%; font-weight: 600; font-family: fonttwo;
}

.naitembox {
width: 45vw; height:max-content; display: flex; flex-direction: column; align-items: center; justify-content: center; background-color: #FFFFFF;
margin-right: 3vw; position: relative; margin-top: 8px; padding: 8px; height: 74vw; border: 1px #E4E6E9 solid;
}

.naitembox img {
width: 100%; height: auto; margin-bottom: 5px; background-color: #FAFAFA;
}
.nalowbox {
width: 100%; display: flex; flex-direction: column;
}
.nalowbox h4 {
font-size: .8rem !important; width: 100%; height: max-content; padding-bottom: 2px; font-weight: 600; font-family: fonttwo;
}
.nalowbox h5 {
font-size: 1rem !important; font-family: fontone; width: 100%; font-weight: 700; color: #001428;
}

/* viewmain styling */
#viewmain {
border-top: none; padding: 0px; padding-top: 55px;
}
#itemdetailingboxone  {
width: 100%; height: max-content; display: flex; align-items: center; justify-content: space-between;
}
#namepriceboxone {
 width: max-content; width: 82%;
}
.wishbtnbox {
width: max-content; height: max-content; display: flex; justify-content: center;
align-items: center; z-index: 9;
}
#wshcount {
font-size: .75rem; padding: 2px; padding-right: 6px; color: #76908F;
}
.wishbtnbox img {
width: 34px; height: 34px; background-color: #FAF1F5; padding: 6px; border-radius: 100%;
}
.wishbtnbox img:active {
transform: scale(.89);
}

#viewitemname {
font-size: 1.1rem; padding-top: 10px; width: 100%; font-family: fontthree; font-weight: 600;
}

#itemshowbox{
width: 100%; height: 100vw; overflow-x: auto; position: relative; display: flex; align-items: center; justify-content: center;
}
#sideshowbox {
display: flex;  align-items: center; justify-content: center; width: max-content; height: max-content; width: 95vw; height: 95vw;  position: relative;
border: solid 1px #FAFAFA; border-radius: 4px; padding: 10px;
}
.itempreviewmg {
height: 100%; width: auto; border-radius: 5px; display: none;position: absolute;
}

#prev,#next {
position: absolute; bottom: 0%; padding: 5px; background-color: transparent; border-radius: 3px; z-index: 9; 
width: 40%; height: 100%;  display: flex; align-items:flex-end; justify-content: center; margin-bottom: 12px; opacity: 0.68;
}
#prev:active,#next:active {
opacity: 1; cursor: pointer; transform: scale(1);
}
#prev {
left: 0%;
}
#next {
right:0%;
}
#next img {
transform: rotate(180deg);
}
#prev img, #next img{
width: 23px; height: auto; 
}

.moretolovedesk {
display: flex; flex-wrap: wrap; width: 100%; height: max-content; padding: 20px; 
}
.sidereccomendbox {
width: 100%; height: max-content; display: flex; flex-wrap: wrap; justify-content: space-between;
}
#moretolovedesktext {
width: 100%; padding-bottom:10px ; border-top: 2px #F1F4F5 solid; padding-top: 10px;
}

#itemdetailingbox {
width: 100%; padding: 10px; height: max-content; padding-top: 0px;
}
#idb-price {
font-weight: 900; font-size: .9rem; font-weight: 590; padding-top: 5px;
}

.idb-optiondropbox {
padding-top: 20px;
}
.idb-optiondropboxtext {
font-size: .9rem; font-weight: 550;
}
.optiondropcont {
width: 100%; height: max-content; position: relative; padding: 10px 0px 10px 0px; display: flex; flex-wrap: wrap; align-items: center;
justify-content: flex-start;
}
.specoptndrop input{
display: none;
}
.specradio-btn {
margin:0px 6px 6px 0px;width: max-content; min-width: 60px; height: 32px; border: 2px solid #E4E6E9; display: flex;  align-items: center;
border-radius: 16px; position: relative; text-align: center; cursor: pointer; justify-content: center; background-color: #E4E6E9;
}
.specradio-btn h4 {
font-size: .9rem; font-weight: 560;  
}
.specoptndrop input:checked+ .specradio-btn {
border: 2px solid #000000; background-color: #000000;
}
.specoptndrop input:checked+ .specradio-btn h4 {
color: #FFFFFF;
}

.clroptndrop input{
display: none;
}
.clrradio-btn {
margin: 0px 4px 4px 0px; width: 62px; height: 62px; border: 2px solid #FFFFFF; display: inline-block;background-color: #FFFFFF;
border-radius: 6px; position: relative; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 1px;
}
.clrradiomg {
width: auto; height: 100%; border-radius: 3px; background-color: #E8F3F8;
}
.clroptndrop input:checked+ .clrradio-btn {
border: 2px solid #0086F3;
}

.itemdesribtionboxone {
position: relative; width: 100%; height: max-content;
}
#idb-description {
font-size: .9rem; padding-top: 10px; color: #808080; font-weight: 500; height: max-content; max-height: 5.1rem;
}
#viewseemore {
text-align: left; z-index: 9; height: max-content; width: max-content; padding: 5px 0px 5px 0px; color: #000000;
font-size: .9rem; font-weight: 450; padding-top: 8px; text-decoration: underline;
}

#idb-ratings {
width: max-content; height: max-content; padding-top: 10px; padding-bottom: 10px; display: flex; align-items: center;
}
.ratingboxone {
width: max-content; height: max-content; display: flex; align-items: center; margin-right: 10px;
}
#ratingstar {
width: auto; height: 17px; 
}
#ratingboxtwo {
width: max-content; height: max-content; color: #808080; font-size: .7rem;
}

.idb-more {
width: 100%; height: max-content; border-top: 2px solid #F1F4F5; padding: 8px 0px 8px 0px;
}
.idbmore-clktext {
font-size: 1rem; font-weight: 550;
}
.idb-more-para {
font-size: .86rem; padding-top: 6px; font-weight: 800; font-weight: 500;
}
.idb-more-para a{
color: #0052FF !important; text-decoration: underline;
}
#tandcsclk {
border-bottom: 2px solid #F1F4F5; 
}
.idb-recomendbox {
width: 100%; height: max-content; padding: 10px; padding-top: 26px; display: flex; flex-wrap: wrap; 
}
#rb-text {
width: 100%;  height: max-content; font-size: 1.1rem; padding-bottom: 16px; padding-top: 18px;
}
#dealbox {
width: 100%; height: max-content; display: flex; align-items: center; padding: 5px; justify-content: center;
 z-index: 9999;  background-color: #FFFFFF;
}

.dealboxbtn {
width: 50%; height: 50px; border-radius: 10px; display: flex; align-items: center; justify-content: center;
}
.dealboxbtn img {
width: auto; height:54%;   margin-left: 10px;
}
#bagitembtn {
background-color: #000000; color: #FFFFFF; font-size: 1.4rem; margin-right: 10px; 
}
#bagitembtn img {
width: auto; height: 42%;
}
#buynowbtn {
background-color: #FFFFFF; color: #000000; font-size: 1.4rem; border: solid #000000 2px; width: 40%; padding-left: 12px;
}

#revdropbox {
width: 100%; height: max-content; padding-bottom: 10px; padding-top: 15px; max-height: 400px; 
overflow-y: auto;
}
.revbox {
width: 100%; height: max-content; display: flex; margin-bottom: 14px;
}
.revbox img {
width: 38px; height: 38px; background-color: #FAFAFA; border-radius: 100%; margin-right: 8px; padding: 6px;
}
.revboxsect {
width: 79%;
}
.revboxsect h6{
color: #000000; font-size: .9rem; width: 100%; text-transform: capitalize;
}
.revboxsect p{
color: #76908F; font-size: .8rem; width: 100%;
}

/* Bag styling */
#bagmain {
padding: 0%; position: fixed; height:100vh; border: none; padding-top: 55px;
}
#bagbox {
width: 100%; height: max-content;  padding-bottom: 160px; display: flex; flex-wrap: wrap; max-height: 93vh;
overflow-y: auto;
}
#bagboxtop {
width: 100%; height: max-content; background-color: #000000; display: flex; flex-wrap: wrap; align-items: center; padding-left: 10px; 
margin-bottom: 12px;
}
.bagboxtopcont {
width: max-content; height: max-content; display: flex;align-items: center; 
}
.bagboxtopcont img {
height: 20px; width: auto; margin:5px ;
}
.bagboxtopcont h6{
font-size: .66rem; color: #FFFFFF;font-weight: 590;
}

.bagboxitem {
width: 100%; height: max-content; margin: 6px; border-radius: 5px; display: flex; align-items: center; background-color: #FFFFFF; border: solid 1px #0A0B0D;
padding: 10px;
}
.bagboxitemmglnk {
width: 70px; height: 70px; margin-right: 10px;
}
.bagboxitem-mg {
width: 70px; height: 70px; background-color: #F1F4F5; border-radius: 2.5px; 
}
.bagboxsect {
width: 73%; height: 100%; 
}
.bbs-box {
width: 100%; height: max-content; display: flex; align-items: center; justify-content: space-between;
}
.bbs-box  h5 {
font-size: 1rem; font-weight: 800;
}
.bagitemdelete {
width: 24px; height: 24px; z-index: 9; display: flex; align-items: center; justify-content: center;
}
.bagitemdelete img{
height: 90%; width: auto; 
}
.bbsboxpart {
margin-top: 4px;
}
.bbsboxpart h6{
color: #808080; font-size: .8rem;
}
.bagitemcontrol {
width: max-content; height: max-content;  margin-top: 7px; display: flex; align-items: center; justify-content: center;
}
.bagitemcontrol button,.bagitemcontrol span {
height: 26px; width: 26px;  display: flex; align-items: center; justify-content: center;
}
.bagitemcontrol span {
font-size: .9rem; font-weight: 900; border-left: 2px solid #000000;  border-right: 2px solid #000000;
}
.lesscontrolbtn, .morecontrolbtn {
font-size: 2rem;
}

#checkoutbox {
width: 100%; height: max-content; position: fixed; bottom: 0%; left: 0%; display: flex; flex-wrap: wrap;
justify-content: center; align-items: center; padding-bottom: 12px; z-index: 999;
}

#promocodebox {
width: 90%; height: 36px; border-radius: 16px; display: flex; align-items: center; position: relative;  margin-bottom: 6px;
}
.promotionalcodeform {
width: 100%; height: 100%; display: flex; align-items: center; 
}
#promotionalcodeput { 
height: 100%; width: 100%; background-color: #FFFFFF; font-size: .8rem; border-radius: 16px; padding: 10px; border: #F1F4F5 solid 2px;
padding-right: 82px ;
}
#promotionalcodebtn {
position: absolute; right: 0%; height: 100%; width: 80px; border-left: 2px #F1F4F5 solid; color: #000000; display: flex; align-items: center;
justify-content: center; font-size: 1.1rem; border-bottom-right-radius: 16px; border-top-right-radius: 16px;
}
#promoresponse {
width: 90%; height: max-content; max-width: 340px; padding: 6px; display: flex; align-items: center; margin-bottom: 2px;
}
#promoresponse img{
height: 20px; width: 20px; margin-right: 6px;
}
#promoresponse h6 {
color: #808080; font-size: .8rem;
}

#checkoutbox h5{
width: 90%; padding: 6px 10px 6px 10px; background-color: #FFFFFF; border: #0A0B0D solid 1px; border-radius: 14px;
color: #000000; font-weight: 500; margin: 6px; font-size: 1rem;
}
#checkoutboxlnk {
width: 52%; height: 50px; border-radius: 10px; background-color: #000000; margin-right: 6px; display: flex;
justify-content: center; align-items: center; 
}
#checkoutboxlnk img{
width: auto; height: 52%; margin-left: 10px;
}
#checkoutboxlnk h6{
color: #FFFFFF !important; font-size: 1rem; text-align: center;
}
#checkoutboxbtn {
width: 36%; height: 50px; border-radius: 10px; background-color: #FFFFFF; display: flex; flex-direction: column; align-items: center;
justify-content: center; background-color: #D1FF00;

}
#checkoutboxbtn h6 {
color: #000000; font-size: 1rem; font-weight: 900;
}

#emptybagbox {
width: 100%; height:max-content; display: flex;flex-direction: column; justify-content: center; align-items: center; padding-top: 20px;
}
#emptybagbox h5 {
font-size: 1rem; width: 85%; height: max-content; margin: 12px; text-align: center; font-weight: 550;
}
#emptybagbox a {
font-size: .9rem; width: max-content; color: #FFFFFF !important; display: flex; align-items: center; justify-content: center;
border-radius: 10px; background-color: #000000; height: 50px; width: 160px;
} 
#emptybagbox img {
width: 80%; height: auto; max-width: 310px;
}

/* checkout styling */

.checkoutform {
width: 100%; height: max-content;display: flex;flex-wrap: wrap; padding-bottom: 100px;
}

#checkouttop {
width: 100%; height: max-content; display: flex; align-items: center; padding-bottom: 26px;
}
#checkouttop h4 {
padding: 6px 10px 6px 10px; font-size: .8rem; color: #808080; 
}
#checkoutactiv {
border: #000000 solid 1px; border-radius: 30px; color: #000000 !important;
}
#cosignlnk {
padding: 6px 5px 5px 0px; color: #000000 !important;
}
#cosignlnk span {
color: #0052FF !important; 
}
.checkoutbox {
width: 100%; height: max-content;
}
#checkoutitembox {
width: 100%; height: max-content; background-color: #F6F3F9; border-radius: 10px; display: flex; flex-wrap: wrap; 
align-items: center; margin-bottom: 10px;
}
.co-itemcont {
width: 100px; height: 100px; border-radius: 5px; display: flex; align-items: center; justify-content: center;
position: relative; overflow: visible;margin: 10px;
}
.co-itemcont img {
width: 100%; height: 100%; border-radius: 5px;
}
#coitemcontcount {
position: absolute; bottom: -7%; right: -7%; background-color: #000000; color: #FFFFFF !important; width: 20px; height: 20px;
border-radius: 100%; display: flex; align-items: center; justify-content: center; font-size: .9rem;
}
.fillformbox {
width: 100%; height: max-content; background-color: #FFFFFF; border-radius: 10px; display: flex; flex-wrap: wrap;padding: 10px;
}
.fillformboxtop {
width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; height: max-content; padding-bottom: 20px;
}
.fillformboxtop a {
font-size: .9rem; color: #000000 !important; padding-top: 2px;
}
.fillformboxtop a span{
text-decoration: underline;
}
.checkoutboxtwo {
margin-top: 10px;
}
.checkoutformput {
width: 100%; height: 50px; border-radius: 10px; background-color: #FAFAFA; font-size: .9rem; max-width: 410px;margin-bottom: 8px;
padding: 10px; border: #F1F4F5 solid 1px;
}
.checkoutboxpaybox {
width: 100%; margin-top: 10px; background-color: #F6F3F9; height: max-content; border-radius: 10px; padding: 10px;
}
.checkoutboxpaybox h4 {
margin-bottom: 10px; font-weight:550; font-size: 1rem;
}
.payboxmethodshow {
width: 100%; display: flex;height:100px; border-radius: 5px; margin-bottom: 12px; align-items: center;
padding: 10px; justify-content: center;
}
.payboxmethodshow img {
width: auto; height: 100%; 
}
.checkoutboxpaybox h3 {
margin-bottom: 8px; width: 100%; display: flex; align-items: center; justify-content: space-between; font-size: 1rem;
font-weight:590;
}
.payboxbottom {
width: 100%; height: 60px; border-top: #FFFFFF solid 2px; display: flex; align-items: center; justify-content: space-between;
padding-top: 6px;
}
#copaymentbtn {
color: #FFFFFF !important; background-color: #000000; height: 50px; border-radius:  10px; width: 160px; display: flex;
align-items: center; justify-content: center; font-size: 1rem;
}
#copaymentbtn img {
height: 42%;margin-left: 10px;
}
#coalertbox {
width: 100%; height: max-content; background-color: #FCEBEC; border-radius: 10px; display: flex; align-items: center;
margin-bottom: 8px;
}
#coalertbox img {
width: 20px; height: 20px; border-radius: 100%; margin: 5px; margin-right: 6px;
}
#coalertbox h4 {
font-size: .8rem; color: #FF0000 !important; font-weight:550;
}
#newttlref {
color: #098551;
}
.promotst {
width: 100%; padding: 2px 5px 2px 5px; height: max-content; font-size: .75rem; 
}
#promerr {
background-color: #EEF6E1; color: #8DE4AF; border-radius: 12px; margin-bottom: 10px;
}
.payboxbottom h5 {
font-size: 1rem;
}

.selshippingoptbox {
width: 100%; height: max-content; display: flex; flex-wrap: wrap; align-items: center; padding: 8px 5px 8px 5px; margin-top: 5px;
background-color: #E8F3F8; border-radius: 5px;
}
#shipopttext {
width: 100%; font-size: .9rem; color: #808080; font-weight: 400; padding-bottom: 5px;
}
.shipoptndrop input{
display: none;
}
.shipradio-btn {
margin: 0px 8px 8px 0px; width:max-content; height: 35px; border: 2px solid #F1F4F5; display: inline-block;background-color: #FFFFFF; z-index: 9;
border-radius: 6px; position: relative; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 2px 4px 2px 4px;
}
.shipradiomg {
height:100%; width:auto;  border-radius: 3px; background-color: #FFFFFF;
}
.shipoptndrop input:checked+ .shipradio-btn {
border: 2px solid #0086F3;
}
     
#loadhold {
position: fixed; z-index: 999; width: 100vw; height: 100vh; display: flex; align-items: center; justify-content: center; backdrop-filter: blur(3px);
bottom: 0%; right: 0%;
}
#loadbox {
width: 90%; max-width: 400px; height: 250px; border-radius: 26px; background-color: #FFFFFF; display: flex; flex-direction: column;
align-items: center; justify-content: center; justify-content: space-between; padding: 30px;
}
#powerdby {
display: flex; align-items: center; justify-content: center; font-size: .9rem; color: #808080;
}
#powerdby img{
height: 25px; width: auto; margin-left: 5px;
}
#spinloader {
height:40px; width: auto; -webkit-animation: spin 2s linear infinite; animation: spin 2s linear infinite;
}
@-webkit-keyframes spin {
0% {-webkit-transform: rotate(0deg);}
100% {-webkit-transform: rotate(360deg);}
}
@keyframes spin {
0% {-webkit-transform: rotate(0deg);}
100% {-webkit-transform: rotate(360deg);}
}
     

/* Payment styling */
#finalmain {
display: flex; flex-wrap: wrap;
}
.finalbox {
width: 100%; background-color: #FAFAFA; border-radius: 5px; padding: 10px; margin-bottom: 10px;
max-width:380px;
}
.finalbox h3 {
padding-bottom: 10px; font-weight: 580;
}
.finalboxsect {
padding-bottom: 6px;
}
.finalboxsect h4 {
margin-right: 10px; color: #808080; font-size: 1rem;  font-weight: 580;
}
.finalboxsect h5 {
font-weight: 580;
}
.finalpaybox {
display: flex;align-items: center; justify-content: space-between;
}
#finalpayboxbtn{
height: 50px; background-color: #000000; color: #FFFFFF !important; font-size: 1rem; width: 100px;
border-radius: 10px;
}

/*success styling*/
#sccssmain{
display: flex; flex-direction: column; align-items: center; justify-content: center;
}
#sccssmain img{
width: 100%; height: auto;
}
#sccssmain a {
width: 200px; height: 50px; border-radius: 10px; color: #FFFFFF !important; background-color: #000000; font-size: .9rem;
display: flex; align-items: center; justify-content: center; margin-top: 5px; margin-bottom: 5px;
}
/* login styling */
#lgnmain {
display: flex; flex-direction: column; align-items: center; justify-content: center; padding-top: 76px;
}
#lgnmain h1 {
font-size: 2rem;
}
#lgnmain p {
font-size: .9rem; color: #808080; 
}
.putbox,.signputbox {
width: 100%; height: 60px; margin-top: 10px;border-radius: 10px;
display: flex; justify-content: center;align-items: center; position: relative;
}
#loginform,#signupform {
width: 100%; height:max-content;padding: 10px; padding-top: 10vh;
}

.loginformput,.signupformput {
width: 100%; height: 100%; border: #A8BAC1 solid 1px; border-radius: 10px; padding: 10px; font-size: .9rem;
}
#loginformbtn,#signupformbtn {
width: 100%; height: 60px; color: #FFFFFF !important; background-color: #000000; font-size: .9rem;
border-radius: 10px; margin-bottom: 20px; margin-top: 30px;
}
.passeyebox {
position: absolute; width: max-content; height: max-content;right: 3%; display: flex; 
justify-content: center; align-items: center; z-index: 9; padding: 2px;
}
.passeyebox:active{
transform: scale(.96);
}
.passeyebox img {
width: auto; height: 24px;
}

#recoverpass {
width: 100%; text-align: end; color: #808080 !important; font-size: .9rem; font-weight: 590;
padding: 4px;
}

#tosignup span{
color: #098551 !important; text-decoration: underline; font-weight: 900;
} 
#tosignup {
width: 100%; color: #000000 !important; font-size: .9rem; padding: 4px;
}

.ls-box {
width: 100%; height: max-content; display: flex; border-radius: 16px; background-color: #FCEBEC;
}
.ls-box  img {
width: 20px; height: 20px; margin: 5px;
}
.ls-box p {
font-size: .4rem; color: #FF0000 !important; padding: 5px;
}

/* user account */
#accountsmain {
border: none; padding-bottom: 20px;
}
#userboxone {
width: 100%; height: 130px; border-radius: 10px; padding: 8px; background-color: #4980AC; display: flex; flex-direction: column; 
justify-content: space-between; margin-bottom: 26px;
}
.userboxonescreen {
width: 100%; height: max-content; display: flex; align-items: center; justify-content: space-between;
}
.userboxonescreen img {
background-color: #F7F5FE; width: 50px; height: 50px; border-radius: 100%; padding: 10px; 
margin-right: 10px;
}
.userboxonescreen h4 {
font-size: 1.2rem; color: #FFFFFF !important; width: 80%;
}

.userboxoneclk {
width: 30%; border: 2px #FFFFFF solid; height: 30px;border-radius: 12px; color: #FFFFFF !important; display: flex; justify-content: center;
align-items: center; font-size: .8rem; 
}
#userboxtwo {
width: 100%; height: max-content; margin-bottom: 26px; padding: 8px; max-width: 740px; padding-bottom: 26px;
}
.userboxtwoscreen {
width: 100%; display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; 
}
.userboxtwoscreen h5 {
color: #000000; font-size: .9rem;
}
.userboxtwoscreen a {
color: #000000 !important; font-size: .8rem; display: flex; justify-content: center; align-items: center; padding: 5px 8px 5px 8px;
}
.userboxtwoscreentwo {
width: 100%; display: flex; flex-wrap: wrap; align-items: center; 
}
.userboxtwoclk {
width: 48%; border: solid #000000 2px; height: 50px; display: flex; align-items: center; border-radius: 26px; margin: 10px 2% 0px 0px;
position: relative; padding: 10px; overflow: visible; max-width: 180px;
}
.userboxtwoclk img {
height: 24px; width: auto;  border-radius:  100%; margin-right: 12px;
}
.userboxtwoclk h6 {
font-size: .8rem; 
}
.userboxtwoclk a {
z-index: 99; width: 100%; height: 100%; position: absolute; top: 0%; left: 0%;
}

.userboxtwoclkcount {
position: absolute; top: -12%; right: -1%; width: 20px; height: 20px; background-color: #000000; border-radius: 100%; 
display: flex; justify-content: center; align-items: center; color: #FFFFFF !important; font-size: .8rem; border: solid 3px #FFFFFF;
}

#userboxthree {
width: 100%; height: max-content; display: flex; flex-wrap: wrap; border-top: solid 2px #F1F4F5; padding-top: 10px;
padding-bottom: 26px; justify-content: space-between;
}
#userboxthree h2 {
width: 100%; font-size: 1rem; padding-bottom: 10px;
}

/* orders styling */
#ordersmain {
border: none;
}
#orderpckbox {
width: 100%; height: max-content; padding-top:10px; overflow-x: auto;
}
.orderpckscroll {
width: max-content; height: max-content;display: flex; flex-wrap: wrap; align-items: center;
}
.orderpckboxlnk {
color: #808080 !important; border: #FAFAFA solid 1px; font-size: .78rem; width: max-content; padding: 5px 16px 5px 16px;
margin: 0px 6px 6px 0px; border-radius: 16px; background-color: #FFFFFF;  height: max-content; font-weight: 800; display: flex;
align-items: center; 
}
.orderpckboxlnk  span {
font-size: .7rem; margin-left: 5px; color: #A8BAC1; font-weight: 200;
}
.orderlnkactiv {
border: #CCFF02 solid 1px; color: #000000 !important;
}
.orderitemcont {
width: 85px; height: 85px;
}
.orderstatus {
border: solid 2px #F1F4F5;
}
.orderreflectbox {
width: 100%; height: max-content; padding-top: 10px; display: flex; flex-wrap: wrap;
}

.orderbox {
width: 100%; background-color: #F7F5FE; height: max-content; max-width:410px; padding: 8px; margin-bottom: 10px;
position: relative;
}
.orderboxlnker {
position: absolute; top: 0%; left: 0%; width: 100%; height: 100%; z-index: 9;
}
.orderboxtop {
display: flex; align-items: center; justify-content: space-between; width: 100%; height: max-content; 
}
.orderboxtop h6 {
font-weight: 500; font-size: .85rem;
}
.orderboxtop h5 {
 font-size: .88rem;
}
.orderboxitems {
width: 100%; height:max-content; display: flex; flex-wrap: wrap; align-items: center; padding-top: 10px;
}
.orderboxbot {
padding-top:5px; border-top: 2px #FFFFFF dashed; margin-top: 5px;
}

.emptyorderbox {
width: 100%; height: max-content; display: flex; flex-direction: column; align-items: center; padding-top: 10px;
justify-content: center; max-width: 360px;
}
.emptyorderbox h2 {
text-align:center; font-size: .9rem;
}
.emptyorderbox a {
padding: 10px 16px 10px 16px; background-color: #000000; color: #FFFFFF !important; font-size: .9rem; width: max-content;
height: max-content; margin: 10px; border-radius: 10px;
}
.emptyorderbox img {
width: 90%; height: auto;
}

/* ordertrack styling */
#ordertrackmain {
background-color: #FAFAFA; min-height: 100vh;
}
.ordertrackbox{
width: 100%; height: max-content; display: flex; flex-wrap: wrap; margin-bottom: 10px;
}
.otbdestinationbox {
width: 100%; height: 30vh; background-color: #FFFFFF; margin-bottom: 10px; overflow-y: auto; padding-bottom: 50px; max-width: 460px;
}
.completebox {
margin-top: 50px;
}
.otbdestinationscroll {
width: 100%; height: max-content; display: flex; flex-direction: column; align-items: center; 
}
.destrouter {
width: 5px; height: 60px; background-color: #5841D8; margin: 2px;
}
.destrouteractive {
background-color: #BAC0C6;
}

.otbdestinationsect {
height: max-content; width: 95%; border: solid 1px #FAFAFA; padding: 5px ; border-radius: 6px; display: flex; align-items: center;
max-width: 420px;
}
.desttextno {
width: 78%;
}
.desttextno h4 {
color: #000000; font-size: .8rem;
}
.desttextno h4 span {
font-size: .78rem; color: #808080; font-weight: 590;
}
.desttextnoactive h4 {
color: #BAC0C6;
}
.desttextnoactive h4 span{
color: #BAC0C6;
}
.otbdestinationsect img {
width: 45px; height: 45px; background-color: #FAFAFA; border-radius: 5px; margin-right: 10px; padding: 8px;
}

.destproc {
width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center;
}

.destproc img {
height: 160px; width: auto; 
}
.destproc h6 {
font-size: .8rem; color: #A8BAC1;
}

.otbsecthold {
width: 100%; height: max-content; max-width: 440px;
}
.otbsec {
width: 100%; height: max-content; display: flex; background-color: #FFFFFF; padding: 10px 5px 10px 5px; max-width: 410px;
margin-bottom: 10px;
}
.otbsec img {
width: 20px; height: 20px; margin-right: 5px; 
} 
.otbsecbox {
display: flex; flex-direction: column; width: 90%;
}
.otbsecboxtwo {
width: 75%;
}
.otbsecbox h6 {
font-size: .8rem; font-weight: 500; padding-bottom: 2px;
}

.otbsectwo {
width: 100%; max-width:420px; flex-wrap: wrap; 
}
.otbsec h4 {
font-size: .9rem; width: 100%; margin-bottom: 12px;
}
.otbsecitembox {
width: 100%; max-width: 410px; height: max-content; border: solid 1.6px #F1F4F5; margin-bottom: 10px;
}
.otbsecitem {
width: 100%; padding: 5px; display: flex; justify-content: space-between;
padding-bottom: 20px;
}
.otbsecitem img {
width: 70px; height: 70px; margin-right: 10px;
}
.revbutton {
width: 120px; border: #000000 solid 1px; height: 40px; margin: 5px;
}

.reviewboxone {
width: 100%; height: max-content; padding: 5px; background-color: #FFFFFF; border-top: dashed 1.6px #F1F4F5;
}
.staruserrev {
display: flex; align-items: center; width: max-content; height: max-content; padding-bottom: 10px; 
}
.revreflct {
width: 100%; height: max-content; 
}
#revwref {
background-color: #EEF6E1; color: #098551; padding: 2px; font-size: .65rem; border-radius: 12px;
}
.starcountbox {
display: flex; align-items: center; justify-content: center; width: 25px; height: 25px;
}
.starcountbox:active{
transform: scale(.96);
}
.starcountbox img {
width: 100%; height: auto;
}
#starcount {
width: 80px; height: 50px; font-size: .8rem; border: solid 1px #76908F; 
}
.reviewboxone textarea {
width: 100%; height: 100px; font-size: .8rem; border: solid 1px #76908F; padding: 10px;
}
.reviewboxone label {
width: 98%; height: 100px; font-size: .8rem;
}
.reviewboxone button {
height: 50px; width: 100%; max-width: 200px; color: #FFFFFF; background-color: #000000; margin-top: 10px;
}

/* admin order track */
.manageorderform {
width: 100%; height: max-content; display: flex; flex-wrap: wrap; padding: 6px; padding-bottom: 20px; max-width: 420px; 
 margin-bottom: 50px;
}
#mofalert {
width: 100%; padding: 5px; font-size: .7rem; border: 1px #098551 solid; color: #BAC0C6; font-weight: 590; max-width: 860px;
margin-bottom: 10px;
}
.mofbox {
width: 100%; max-width: 420px;height: max-content;
}
.manageorderform label {
font-size: .8rem;
}
.manageorderform textarea {
width: 100%; max-width: 420px; height: 125px; border: #0A0B0D solid 2px; padding: 10px; font-size: .9rem;
margin-bottom: 10px;
}
.manageorderform input {
width: 100%; max-width: 420px; height: 50px; border: #0A0B0D solid 2px;padding: 10px; font-size: .9rem;
margin-bottom: 10px;
}

.manageorderform select {
width: 100%; max-width: 420px; height: 50px; border: #0A0B0D  solid 2px; padding: 10px; font-size: .9rem;
margin-bottom: 20px;
}

.manageorderform button {
width: 100%; max-width: 420px; height: 50px; background-color: #000000; color: #FFFFFF !important; font-size: .9rem;
}

.eptadmin {
width: 100%; height: 150px; display: flex; align-items: center; justify-content: center; border: solid 1px #FAFAFA;
}
.eptadmin h3 {
font-size: .9rem; color: #A8BAC1; font-weight: 590; width: 90%; text-align: center;
}

/* wish styling */
.wishbox {
width: 100%; height: max-content; display: flex; flex-wrap: wrap;
}
.wishboxitem {
position: relative; display: flex; justify-content: center; align-items: center;
width: 100px; height: 100px; margin: 0px 10px 10px 0px;
}
#wishboxitemlnk {
width: 100%; height: 100%; z-index: 9;position: absolute; top: 0%; left: 0%;
}
#remwish {
position:absolute; top: 0%; right: 0%; width: 28px; height: 28px; display: flex;
justify-content: center; align-items: center; z-index: 99;
}
#wishboxitemg {
width: 100%; height: 100%; background-color: #F7F5FE;
}
#wishlnkmg {
width: 86%; height: auto;
}

/* policy styling */
#policymain h1 {
font-size: 1rem; padding-top: 26px;
}
#policymain p,#policymain li {
font-size: .9rem; padding-top: 6px;
}

/* Support styling */
#supportmain {
border: none;  background-color: #FAFAFA; height: 96vh; position: fixed; display: flex; flex-direction: column;
align-items: center;
}
.supportmaintop {
width: 96%; height: 60px; display: flex; align-items: center; position: fixed; z-index: 999; border-bottom: 1px solid #eff5ee; 
padding:5px; padding-bottom: 10px;
}
.supportmaintop a {
width: 42px; height: 42px;  margin: 5px; display: flex; align-items: center;  justify-content: center; margin-right: 10px; border-radius: 100%;
border: 1px solid #000000;
}
.supportmaintop a img {
width: 60%;
}
#supportchatactive {
margin-right: 25px; background-color: #FFFFFF; width: 48px; height: 48px; border-radius: 100%;
}
.chatbox {
width: 100%; height:100%; padding-top: 10px; position: relative; overflow-y: auto; padding-bottom: 200px;
}
.reachmain {
padding-top: 80px;
}
.chatboxscroll {
width: 100%; height: max-content; display: flex; flex-direction: column;justify-content: end;
}

.chatboxreflone ,.chatboxrefltwo {
height: max-content; width: 100%; display: flex; 
}
.chatboxreflone h2,.chatboxrefltwo h2 {
font-size: .8rem; width: max-content; max-width: 80%; height: max-content; border-radius: 10px; padding: 6px 8px 6px 8px; 
margin-bottom: 8px;
}
.chatboxrefltwo h2{
 background-color: #D4EEFF;
}
.chatboxreflone h2{
background-color: #FFFFFF;
}
.chatboxrefltwo {
justify-content: end;
}
.chatcircle {
width: 10px; height: 10px; border-radius: 100%; background-color: #000000; margin: 5px;
}
.chatcircleone {
background-color: #FFFFFF;
}
.chatcircletwo {
background-color: #D4EEFF;
}

#chatboxform {
height: 70px; border-radius: 10px; width: 94%; background-color: #FFFFFF; position: relative; display: flex;
padding: 5px; margin-bottom: 8px; position: fixed; bottom: 0%; left: 0%; margin: 8px; max-width: 700px; 
}
#chatboxtexta {
width: 100%; height: 100%; position: relative; border-radius: 5px; padding: 10px; padding-right: 55px;
overflow-y: auto; font-size: .9rem; border: solid #F7F5FE 1px; background-color: #EDF8F0;
}
#chatboxtexta:focus {
background-color: #EDF8F0; border: none !important;
}
.chatboxsubbox {
width: 50px; height: 100%; position: absolute; right: 0%; top: 0%; display: flex; align-items: center;
justify-content: center; padding-right: 5px; 
}

#reachsubbtn {
width: 38px; height: 38px; background-color: #FFFFFF; border-radius: 100%; z-index: 98; display: flex; align-items: center; justify-content: center;
}
#reachsubbtn img {
width:65%; height: auto;
}

/* admin styling */
#adminmain {
width: 100%; height: max-content; display: flex; flex-wrap: wrap; align-items: center; padding-bottom: 50px; padding-top: 10px;
}
#adminboard {
width: 100%; height: max-content; padding-bottom: 20px; display: flex; flex-direction: column; border-bottom: 1px #F1F4F5 solid;
margin-bottom: 20px;
}
#admingreet {
background-color: #0052FF; width: 100%; max-width: 400px; padding: 10px 20px 10px 8px; height: max-content; color: #FFFFFF; border-radius: 8px; font-size: 1rem;
margin-bottom: 40px; 
}

.adminlnkbox {
width: 100%; height: 40px; display: flex; align-items: center; position: relative; margin-bottom: 6px;
}
.adminlnkbox a,#adminlnkbtn {
position: absolute; width: 100%; height: 100%; top: 0%; left: 0%; z-index: 9;
}
.itemcontrollnks {
width: 100%; height: max-content; padding-left: 22px; display: flex; flex-direction: column; 
}
.acllink {
color: #181E20 !important; font-size: .9rem; margin: 1px; padding: 4px;  height: 35px;
display: flex; align-items: center;
}
.acllink {
border-bottom: 1px #F1F4F5 solid;
}
#acllinkone {
border-top: 1px #F1F4F5 solid;
}
.adminlnkbox a:hover {
border-top: #F1F4F5 1px solid; border-bottom: #F1F4F5 1px solid; 
}
.adminlnkbox img {
width: 20px; height: 20px; margin-right: 10px;
}
.adminlnkbox  span {
font-size: .9rem;
}
.admincount {
position: absolute; right: 1%; padding: 5px; border-radius: 5px; color: #FFFFFF !important; background-color: #FF0000;
font-size: .7rem !important; height: 18px; width: 18px; display: flex; align-items: center; justify-content: center;
}
#adminlogout {
margin-top: 20px; font-size: .9rem; color: #0052FF; width: 100%; text-align: center;
}
#adminlogout:hover {
color: #808080 !important;
}

#adminbox {
width: 100%; height: max-content;
}
.adminboxsect {
width: 100%; height: max-content; display: flex; flex-wrap: wrap; align-self: center; overflow-y: auto;
margin-bottom: 20px;
}
#adminboxintro {
font-size: 1rem; margin-bottom: 20px; width: 100%;
}

.adminboxsectintro {
width: 100%; height: max-content; font-size: .86rem; color: #808080; padding-bottom: 5px; display: flex; justify-content: space-between;
align-items: center;  margin-bottom: 5px;
}
.adminboxsectintro a {
color: #000000; font-size: .6rem; color: #FFFFFF !important; width:max-content; height: max-content; background-color: #000000; border-radius: 4px;
padding: 5px 16px 5px 16px;
}
.chatnotifbox {
width: 100%; max-width: 420px; height: 50px; display: flex; align-items: center;position: relative; border-top: #FAFAFA solid 1px;
border-bottom: #FAFAFA solid 1px; padding-left: 4px;
}
.chatnotifbox a {
position: absolute; top: 0%; left: 0%; height: 100%; width: 100%; z-index: 9;
}
.chatnotifbox img {
width: 35px; height: 35px; background-color: #DEECF2; border-radius: 100%; margin-right: 8px; padding: 7px;
}
.notifboxsect {
width: max-content; height: 100%;
}
.notifID {
width: max-content; height: max-content; color: #000000; font-size: .8rem; margin-bottom: 5px;
}
.notiftext {
font-size: .75rem; color: #808080;
}

.notifstatus {
width: 18px; height: 18px; border-radius: 100%; background-color: #098551; color: #FFFFFF !important; font-size: .6rem !important;
position: absolute; right: 2%; display: flex; align-items: center; justify-content: center;
}
.notifseen {
background-color: #FFFFFF; width: max-content; height: max-content; color: #A8BAC1 !important; border-radius: 0%; font-size: .7rem !important;
}

.paymentbox {
width: 100%; max-width: 440px; display: flex; align-items: center; justify-content: space-between; border: #A8BAC1 solid 1px; position: relative;
margin-bottom: 12px;
}
.paymentbox a {
position: absolute; top: 0%; left: 0%; width: 100%; height: 100%;
}
.paymentboxsect {
width: max-content; height: max-content; margin-right: 10px; padding: 5px;
}
.paymentboxsect h5 {
font-size: .9rem; color: #000000; font-weight: 590;
}
.paymentboxsect span {
font-size: .8rem; color: #808080; font-weight: 590;
}
.lastpbs {
margin: 0%;
}

.admoptclkbox {
height: max-content; width: 100%; margin-bottom: 10px; display: flex;flex-wrap: wrap;
}
.admoptclkbox a {
padding: 3px 10px 3px 10px; font-size: .7rem; border: solid 1px #000000; border-radius: 16px; margin: 0px 5px 5px 0px; color: #000000 !important;
height: max-content; width: max-content; font-weight: 540;
}

.ordersearchboxcont {
width: 100%; height: max-content; margin-bottom: 20px;
}
.ordersearchbox {
position: relative; width: 100%; max-width: 420px; height: 40px; display: flex; align-items: center; border-radius: 26px;justify-content: center;
}
#ordersearchform {
height: 100%; width: 100%;  display: flex; align-items: center;position: relative;
}
#ordersearchform input {
width: 100%; height: 100%; padding: 10px; font-size: .8rem; background-color: #FAFAFA; padding-right: 52px; border: solid 1px #DEECF2;
border-radius: 26px;
}
#ordersearchform button {
height: 98%; width: 50px; border-left: 2px solid #F1F4F5; position: absolute; right: 1px; z-index: 9; border-top-right-radius: 26px;border-bottom-right-radius: 26px;
display: flex; align-items: center; justify-content: center; padding: 4px;
}
#ordersearchform button img {
height: 100%; padding-top: 2px;
}
/* control styling */
.controltop {
width: 100%; height: max-content; display: flex; align-items: center; justify-content: space-between; padding-bottom: 10px; margin-bottom: 10px;
border-bottom: 1px #000000 solid;
}
.controltop h3 {
font-size: .9rem;
}
.controltop h4 {
font-size: 2rem;
}
.controlbox { 
width: 100%; height: max-content;
}
#additemform {
width: 100%; height: max-content; display: flex; flex-wrap: wrap; align-items: center;
}
.addformbox {
width: max-content; height: max-content; width: 100%; max-width: 410px; margin-bottom: 10px;
}
.addformbox label {
font-size: .8rem;
}
.addformput,#pchecksel {
width: 100%; max-width: 410px; height: 50px; border: solid #A8BAC1 1px; padding: 10px; border-radius: 4px; font-size: .8rem;
}
#promoalertest {
font-size: .7rem; color: #ACD0A0; border: 1px solid #ACD0A0; width: max-content; height: max-content; padding: 5px 10px 5px 10px;
margin-bottom: 10px;
}
.addformtext {
width: 100%; height: 200px; border: solid #A8BAC1 1px; padding: 10px; border-radius: 4px; font-size: .8rem;
}
#addformbtn{
width: 100%; height: 50px; border-radius: 4px; color: #FFFFFF !important; background-color: #000000; max-width: 410px;
}
#addformmg {
width: 100%; border-radius: 4px; max-width: 360px;display: flex; padding: 12px ; margin-bottom: 10px;  height: 50px;
border: solid #A8BAC1 1px;
}
#controlalert {
width: max-content; max-width: 100%; padding: 4px; display: flex; align-items: center;
border: solid 1px #FF0000; background-color: #EF8F8F; margin: 2px;
}
#controlalert img {
width: 18px; height: 18px; margin-right: 10px;
}
#controlalert span {
font-size: .8rem; 
}

/* color control */
.clrcntrlreflct,#clrcntrlform {
width: 100%; height: max-content; display: flex; flex-wrap: wrap; 
}
#clrcntrlform {
 margin-bottom: 20px; border-bottom: #F1F4F5 1px solid;
}

.clrcntrlreflct {
margin-bottom: 10px; padding-bottom: 10px; 
}
.clrshowbox {
width: max-content; height: max-content; border:  1px solid; display: flex; padding: 10px; align-items: center;
margin-bottom: 10px; margin-right: 10px;
}
.colorshowimg {
width: 40px; height: 40px; margin-right: 12px;
}
.clrshowbox h3 {
font-size: .9rem;
}
.clrshowbox a {
display: flex; align-items: center; justify-content: center; width: 20px; height: 20px; border-radius: 100%; border: #000000 1px dashed;
 margin-left: 10px;
}
.delclrimg {
width: 90%; height: auto;
}

.clrformbox {
width: 100%; height: max-content; display: flex; flex-direction: column; max-width: 410px; margin-top: 10px;
}

.clrformbox input {
width: 100%; height: 45px; border: solid 1px #A8BAC1; font-size: .8rem;
}
.clrformbtn {
width: 100%; max-width: 410px; height: 45px; color: #FFFFFF; background-color: #000000; 
}
#clrmgput {
padding: 10px; 
}
.clrformlnk {
width: 100%; max-width: 360px; height: 45px; color: #000000 !important; background-color: #FFFFFF; border:solid 2px #000000;
display: flex; align-items: center; justify-content: center; margin-top: 10px;
}


/* final control keyword */
.keywordbox {
 width: 100%; height: max-content; padding: 10px 0px 10px 0px; padding-bottom: 100px;
} 
.keyform {
border-top: 1px #F1F4F5 solid; padding-top: 10px;
}

/* merchant det styling */
#merchform {
width: 100%; height: max-content; display: flex; flex-wrap: wrap;
}
.merchformbox {
width: 100%; max-width: 420px; margin-bottom: 12px;
}
.merchformbox label {
font-size: .9rem; 
}
.merchformbox input {
font-size: .9rem; height: 50px; width: 100%; border: solid 1px #A8BAC1; padding: 10px;
}
.merchformbox button {
width: 100%; margin-top: 24px; height: 50px; background-color: #000000; color: #FFFFFF;
padding: 10px;
}
#merchalert {
width: 100%; max-width: 734px; border: #098551 1px solid; padding: 8px; font-size: .7rem; margin-bottom: 15px;
}


/* poster control */
.pshowbox {
width: 100%; max-width: 410px; height: max-content; display: flex; align-items: center; justify-content: center;
position: relative; margin-bottom: 20px; min-height: 200px; background-color: #F1F4F5;
}
.pshowboximg {
width: 100%; height: auto;
}
.posterupdtform {
position: absolute; bottom: 0%; width: 100%; height: max-content; backdrop-filter: blur(6px); padding: 10px; display: flex; flex-direction: column;
align-items: center; justify-content: center;
}
.placetextref {
width: 100%; height: fit-content; font-size: 1.2rem; padding-bottom: 10px; border-bottom: 1px #FAFAFA solid; margin-bottom: 20px; padding-top: 20px;
}
.sectpshowbox {
flex-direction: column; border: 2px solid #F1F2F4;
}
.sectposterupdtform {
position: static; background-color: #E4E6E9;
}
.sectpshowboxput {
width: 100%; height: 50px; padding: 10px; background-color: #FAFAFA;
}
#sectpshowboxtextput {
height: 100px !important; border: solid #A8BAC1 1px;
}
/* item edit styl */
.itemreflctbox {
width: 100%; height: max-content; display: flex; flex-wrap: wrap;justify-content: space-between; 
}
.reflctitem {
position: relative; width: 48%; height: max-content; display: flex; flex-direction: column; max-width: 205px;
margin-bottom: 4%; 
}
.reflctitem img {
width: 100%; height: auto; margin-bottom: 5px;
}
.reflctitem a {
width: 100%; height: 100%; position: absolute; top: 0%; left: 0%; z-index: 9;
}
.reflctitem h3 {
font-size: .8rem; font-weight: 590; width: max-content;
}
#decomform {
width: max-content; height: max-content; z-index: 999; display: flex; flex-direction: column;
}
#decomform button {
border-radius: 5px; padding: 5px 10px 5px 10px; width: max-content; background-color: #000000; color: #FFFFFF;
height: max-content; margin-top: 10px; font-size: .9rem;
}
#decomselect {
width:120px; height: max-content; font-size: .8rem; border-radius: 3px; border: #000000 solid 1px; padding: 5px 10px 5px 10px;
}
.reflectshipmg {
height:170px; justify-content: space-between; border: solid #F1F4F5 1px; padding: 10px;
}

/* recovery stylin */
#recovermain {
width: 100%; height: max-content; min-height: 90vh; display: flex; align-items: center; justify-content: center;
}
#recoverform {
width: 100%; height: max-content; max-width: 420px; display: flex; flex-direction: column;align-items: center; justify-content: center;
}
.recformbtn {
padding: 0%;
}
#recformp {
font-size: .8rem; padding-bottom: 10%; width: 100%; color: #808080; max-width: 410px;
}
#recalert {
width: 100%; background-color: #EF8F8F; font-size: .8rem; padding: 3px 8px 3px 8px; height: max-content; font-weight: 580; color: #C71925;
margin-bottom: 26px; border-radius: 8px; max-width: 410px; 
}
#recconfirm {
width: 100%; background-color: #ACD0A0; font-size: .8rem; padding: 2px 8px 2px 8px; height: max-content; font-weight: 580; color: #098551;
margin-bottom: 26px; border-radius: 8px; max-width: 410px;
}

@media (max-width: 700px) {
::-webkit-scrollbar,.deskinclude,.msovtcontboxtwo,.desklnk {
display: none !important; 
}
#dealbox {
position: fixed; bottom: 0%;  left: 0%;
}
}
@media (max-width: 900px) {
.msovtcontboxtwo,.taklkoff {
display: none !important; 
}
}

/*  Desktop styling start here  */
@media (min-width: 700px) {
.bagside::-webkit-scrollbar,.idb-recomendbox::-webkit-scrollbar,.mainscreenfourscrollbox::-webkit-scrollbar {
display: none;
}
main {
padding-top: 50px;
}
::-webkit-scrollbar {
width: 4px; 
}
::-webkit-scrollbar-track {
background-color: transparent;
}
::-webkit-scrollbar-thumb {
background-color: #F1F4F5;
}
::-webkit-scrollbar-thumb:hover {
background-color: #000000;
}
.adminboxsect::-webkit-scrollbar-thumb:hover{
background-color: #000000;
}
/* recovery stylin */
#recalert,#recconfirm,#recformp {
max-width: 380px;
}
/* item reflect */
.itemreflctbox { 
justify-content: flex-start;
}
.reflctitem {
margin: 0% 2% 2% 0%; max-width: 150px; 
}
/* poster control */

.pshowbox { margin-right: 20px; }
/* merchant det styling */
.merchformbox {
width: 100%; width: 360px; margin: 0px 12px 12px 0px;
}
/* ordertracking */

.otbsec {
margin-right: 10px;
}
.otbsecitembox {
margin-right: 10px; width: 400px;
}
.otbsectwo {
width: max-content; max-width:100%; flex-wrap: wrap;
}
.otbsecboxtwo {
width: 80%;
}
.otbdestinationbox {
margin-right: 10px; 
}
.mofbox {
margin-right: 20px;
}
.manageorderform {
max-width: 900px; padding: 10px; margin-bottom: 50px;
}
.manageorderform textarea {
height: 135px;
}
/* control styling */
.addformbox {
width: 24%; min-width: 340px;  margin-right: 10px; margin-bottom: 30px;
}
.addformput,#addformbtn {
height: 45px;
}
#addformbtn {
width: 320px; margin-top: .8rem;
}
.addformtext {
height: 150px;
}
.textformbox {
max-width: 500px; width: 30%;
}
#addformmg {
margin-right: 10px; height: 45px;
}

/* color control */
.clrformbox, .clrformbtn,.clrformlnk {
max-width: 340px; margin: 0px 10px 10px 0px;
}

/* admin styl */
#admingreet {
width: max-content;
}
.paymentbox {
margin-right: 12px; margin-bottom: 20px;
}
.ordersearchbox {
height: 32px; width: 360px;
}
#ordersearchform button {
padding: 5px;
}
#ordersearchform input {
font-size: .7rem;
}

/* header styling */
header {
position: fixed; top: 0%; left: 0%; background-color: #FFFFFF; padding-right: 10px; height: 50px;
z-index: 99999;
}
#storename {
font-size: 1.2rem;
}
.jumpbtn {
margin-left: 40px;
}
#menubtn {
margin-left: 10px;
}
.jumplnk img , .jumpbtn img {
height: 80%; width: auto;
}
#bagjump img {
height: 80%;
}
.menuslide {
position: fixed; z-index: 9999; padding-top: 60px;
}
.headmaintop {
border-top: solid 1px #000000; border-bottom: solid 1px #000000;
}
/* main styling */
main {
padding: 10px; padding-top: 52px;
}
.mainscreentwoscroll {
justify-content: flex-start;
}
#categorscroll a {
padding: 10px 20px 10px 20px; width: max-content; height: max-content; color: #000000 !important;border-radius: 30px; display: flex; 
justify-content: center; align-items: center; font-size: 1rem; margin: 0px 10px 10px 0px;
}
#categorscroll a {
margin: 0px 0px 0px 6px; padding: 8px 18px 8px 18px;
}

.itembox,.naitembox {
width: 180px;  height: 300px; position: relative; margin: 0px 25px 25px 0px;
}

.itembox img,.naitembox img {
width: 100%; height: auto;  background-color: #F7F5FE;
}
.naitembox img {
margin-bottom: 5px;
}

.hmtboxone {
border-right: 1px solid #000000; width: 20%;
}
#pyrexanchdiv {
height: 30px; padding: 0%; align-items: center;
}
#finadealprice,#itemdealprice,#itemshowprice,.nalowbox h4  {
font-size: .7rem;
}


/* collection desk styling */
#categorscroll {
padding: 6px;
}
#categorscroll a {
margin: 0px 0px 0px 6px;
}
.collectionbox {
padding: 10px; justify-content: flex-start;
}
/* viewmain */
#viewmain {
display: flex; justify-content: space-between; align-items: flex-start; height: max-content;
}

#itemshowbox{
width: 50%; height:100vh; overflow-y: auto; overflow-x: hidden; border-right: #F1F4F5 solid 1px;
padding: 10px; flex-direction: column; align-items: center; justify-content:flex-start;
}
#sideshowbox {
width: 48vw; height: 48vw; display: flex;  justify-content: center; flex-wrap: wrap; align-items: flex-start; left: 1.5%;
}
.itempreviewmg {
height: 100%; width: auto;  border-radius: 4px; 
}
#itemdetailingbox {
width: 50%; padding: 10px; height: max-content; padding-top: 30px;  overflow-y: auto; max-width: 460px;
}
.idb-recomendbox {
display: none;
}

#rb-text {
border: none; padding-top: 0%;
}
#dealbox {
padding-top: 60px;  width: 80%; min-width: 370px;
}
.bottomcont {
padding-bottom: 20px;
}
.deskimgsel {
width: 100%; height: max-content; display: flex; flex-wrap: wrap; align-items: center; padding: 10px;
padding-right: 0px;
}
.deskpreviewmg {
width: 11%; height: auto; margin: 0px 10px 10px 0px; background-color: #FAFAFA; border-radius: 2px; min-width: 50px;
}
.catologbox {
width: 24.9%; height: 180px;
}


/* bag styling */
#bagbox {
width: 100%; padding-bottom: 200px;
}
#checkoutbox {
width:50vw;  margin-left: 10vw; margin-bottom: 20px; max-width: 300px;
}
#promocodebox {
width: 96%; max-width: 350px; margin-bottom: 6px; height: 36px;
}
#checkoutbox h5{
width: 350px;
}
#checkoutboxlnk{
width: 160px;
}
#checkoutboxbtn {
width: 120px;
}
.bagboxtopcont {
margin-right: 40px;
}

.bagside {
display: none;
}


#bagmain {
display: flex; justify-content: center;
}
.bagboxitem {
padding: 10px 20px 20px 10px; max-width: 360px; height: max-content;
}

/* checkout desk styling */
.checkoutbox {
width: 49%; 
}
.checkoutboxtwo {
margin-left: 10px; margin-top: 0px;
}
.checkoutformput {
height: 46px; width: 46%; margin: 0px 8px 8px 0px; min-width: 280px;
}
.fillformbox {
background-color: #DEECF2;
}
.checkoutformput  {
background-color: #FFFFFF; border: none;
}
.fillformboxtop {
padding-bottom: 10px;
}
.fillformboxtop a {
padding-top: 0px;
}

/* Payment styling */
.finalbox {
width: 40%; min-width: 360px; max-width: 40%; margin-right:10px ;
}
.finalboxsect {
display: flex; align-items: center; flex-wrap: wrap; padding-bottom: 6px;
}
/* success */
#sccssmain img {
width: 400px; 
}
#sccssmain a {
width: 200px; height: 45px; border-radius: 10px; color: #FFFFFF !important; background-color: #000000; font-size: .9rem;
display: flex; align-items: center; justify-content: center; margin-top: 5px; margin-bottom: 5px;
}
/* login stylin */
#loginform,#signupform  {
width: 30%; min-width: 380px; max-width: 400px;
}
#signupform {
display: flex; flex-wrap: wrap;width: 50%; min-width: 600px; max-width: 700px;
}
#signupformbtn {
width: 45%; margin-top: 20px;
}
.signputbox {
width: 45%; margin: 10px 10px 0px 0px; height: 56px;
}
.putbox,#loginformbtn,#signupformbtn {
height: 56px;
}
.ls-box {
width: max-content; height: max-content; display: flex; align-items: center; border-radius: 16px; background-color: #F1F4F5;
min-width: 80%;
}
.ls-box  img {
width: 16px; height: 16px; margin: 5px;
}
.ls-box p {
font-size: .6rem; color: #000000 !important; padding: 5px;
}
/* account user */
#accountsmain {
display: flex; flex-wrap: wrap; 
}
#userboxone {
width: 380px; margin-right: 20px; 
}
#userboxtwo {
background-color: #FAFAFA; border-radius: 10px; padding: 10px; height: 130px; min-width:max-content ;
}
.userboxtwoclkcount {
border: solid #FAFAFA 3px;
}
.userboxtwoclk  {
margin-right: 16px; margin-top: 20px; max-width: 160px;
}
#userboxthree {
justify-content: flex-start;
}
/* orders styling */
.orderbox {
margin: 0px 10px 10px 0px; min-width: 360px; max-width: 100%; width: max-content;
}
/*policy stylig */
#policymain p,#policymain li {
width: 90%;
}

/* mob include */
.mobinclude {
display: none !important;
}
}

@media (min-width: 860px) { 
/* admin styl */
#adminboard {
width: 30%; max-width: 300px; min-width: 260px; border-right: #F1F4F5 solid 1px; height: 98vh; position: fixed; z-index: 99;
top: 0%; margin-top: 55px;
}
#adminbox {
margin-left: 310px;
}
#adminbox {
width: 70%;  padding-left: 10px; padding-bottom: 40px; min-height: 98vh;
}
#adminboxintro {
margin-bottom: 10px; width: 100%; border-bottom: #FAFAFA 1px solid; padding-bottom: 10px;
}

.chatnotifbox {
margin: 0px 8px 8px 0px; border: solid #FAFAFA 2px; border-radius: 5px;
}
.adminlnkbox {
width: 98%;
}
.admincount {
right: 8%;
}
.moblnk {
display: none !important; 
}

#bagbox {
width: 80%;
}
.bagside {
display: inline; width: 20%; height: 100vh; overflow-y: auto; background-color: #FAFAFA; padding: 8px 0px 160px 2vw; 
}
.bagside h3 {
width: 100%; font-size: .9rem;padding-bottom: 10px;
}
}

@media (min-width: 1000px) { 

#introtext {
font-size: 4.7rem; width: 100%; 
}
#itemshowbox{
width: 34%; height: 100vh; overflow-y: auto; overflow-x: hidden; border-right: #F1F4F5 solid 1px;
padding-top: 30px;
}
#itemdetailingbox {
width: 46%; padding: 10px; height: max-content; padding-top: 30px;  overflow-y: auto; max-width: 460px;
}
.idb-recomendbox {
width: 20%; height: 100vh;  overflow-y:auto; background-color: #FAFAFA; display: inline; padding: 10px 0px 100px 2vw;
}
.sidereccomendbox {
width: 100%; height: max-content; display: flex; flex-wrap: wrap; justify-content: flex-start;
}


#sideshowbox {
width: 32vw; height: 32vw; display: flex;  justify-content: center; flex-wrap: wrap; align-items: flex-start; left: 1.5%;
}

/* control part */
.clrformbtnbox {
padding-top: 24px;
}
}

@media (min-width: 1300px) { 
#itemshowbox{
width: 30%; height: 100vh; overflow-y: auto; overflow-x: hidden; border-right: #F1F4F5 solid 1px;
padding-top: 30px;
}
#itemdetailingbox {
width: 40%; padding: 10px; height: max-content; padding-top: 30px;  overflow-y: auto; max-width: 460px;
}
.idb-recomendbox {
width: 30%; height: 100vh;  overflow-y:auto; background-color: #FAFAFA; display: inline; padding: 10px 0px 100px 2vw;
}

#sideshowbox {
width: 28vw; height: 28vw; display: flex;  justify-content: center; flex-wrap: wrap; align-items: flex-start; left: 1.5%;
}

#bagbox {
width: 70%;
}
.bagside {
width: 30%; height: 97vh; overflow-y: auto; background-color: #FAFAFA; padding: 8px 0px 100px 2vw; 
}
}

