@charset "utf-8";
/* CSS Document */
	
*{margin:0;padding:0}
	
html,body{
/*    font: 1em "Lucida Grande", Tahoma, Verdana, sans-serif; 
    color: #404040;*/
overflow-x: hidden;
}
body {position: relative;}


#UserVarMenu{font-family:Calibri}

#Slider{width:90%;float:left;margin-right:1%;padding:20px;}
.firstCaps {text-transform: capitalize}

.hr{border:none 0;border-top:1px dashed #c2c2c2;min-height:1px;margin:15px 0 0 0}
input[type="text"],input[type="email"],input[type="number"],input[type="password"],input[type="file"],textarea{padding:2px 2px 2px 2px; border:2px solid #ccc;font-size:1.0714285714285714em;border-radius:5px;width:85%;box-shadow:0px 0px 3px #d3d6d6;-webkit-box-shadow:0px 0px 3px #d3d6d6;-moz-box-shadow:0px 0px 3px #d3d6d6;-o-box-shadow:0px 0px 3px #d3d6d6}
input[type="text"]:focus,input[type="password"]:focus,input[type="email"]:focus,input[type="number"]:focus,input[type="file"]:focus, textarea:focus{border:2px solid #e7ce6b;background-color:#fefbf1;outline:none},select:focus{border:2px solid #e7ce6b;background-color:#fefbf1}

input[type="text"][disabled], input[type="number"][disabled], input[type="email"][disabled],select[disabled]{background-color: white; color: grey;border: 1px solid #E9EAEE;}

SELECT{font-family:Arial,sans-serif;font-size:1em;color:#151515;font-weight:normal;text-decoration:inherit;text-transform:none;padding:11px;border-radius:3px;cursor:pointer;padding-right:46px;background-image:none;background-color:#FFF;border:1px solid #CCCCCC;width:100%}
.Qty_Dropdown{padding:5px;width:70px}

.mid_textBox{
padding:1px;
height: 20px; 
width: 200px; 
}


.logo{height:40px}

p {display: block;text-align:justify}

a:link {color:#000000;text-decoration:none}      /* unvisited link */
a:visited {color:#000000;text-decoration:none}  /* visited link */
a:hover {color:##500050;}  /* mouse over link */
a:active {color:#000000;}  /* selected link */ 
img{border:none}
.label{text-align:left;margin-left:0px;margin-right:0px;margin-top:0px;width:100%;display:block;padding-bottom:5.0px;font-weight:bold}
/* label, P {font-family: arial,tahoma,verdana,sans-serif;} */

h1,h2,h3{padding:0;margin:0;text-align:left;font-size:inherit}
.HomeTopContainer{width:48%; padding:5px} 
.headImg{width:50%;padding-left:100px}


.cart{width:48px;height:48px;position: relative;text-align: center;}
.cart_txt, .text_top_right,.check_top_right:after{position: absolute;
	border-radius: 50%;
  background: #000000;
  width: 20px;
  height: 20px;  
  color:#ffffff;
  text-align: center;
  border: 2px solid #fff;
  font-weight:bold;
}

.top_right{	position: absolute;   top: 3px; right: 3px;}
.discount{
	border-radius: 5%;
  background: #7300AD;
  width: 75px;
  height: 20px;  
  color:#ffffff;
  text-align: center;
}
.cart_txt{top: 50%;left: 50%;transform: translate(-50%, -50%);}
.text_top_right,.check_top_right:after {top: 8px;right: 8px;cursor: pointer;}
.check_top_right:after{content: '✔';
	border: 2px solid #0f0;
	background: #ffffff;
	box-shadow: inset 0 1px 3px rgba(0,255,0,.3);
	color:#00ff00;
}

#Login{padding-top:8px;cursor:pointer;float: right;}
#loginModal{position: fixed;
  display: none;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.5);
  z-index: 700;
  cursor: pointer;
}
/* The Close Button */
.close { color: #aaaaaa;float: right;font-size: 28px;font-weight: bold;}
.close:hover,.close:focus {
  color: #000;text-decoration: none;cursor: pointer;}
  
.modalPop{margin: 5%;width: 320px;background-color: #FFFFFF;padding:10px;}
  
#modalFrame{
height:400px;
}


.TopHeader{width:100%; height:65px;}

.rightFix{float:Left;position: fixed;right:0;z-index:800;}

header {
position: fixed;z-index:400;
height:60px;
border-bottom: 1px solid #ECECEC;
background:#ffffff;
-moz-border-radius:0 0 5px 5px;
-webkit-border-radius:0 0 5px 5px;
border-radius:0 0 5px 5px;
}
/* For Shadow */
header ,#Slider ,#Why_We, #Left_Search_box, #container_100{
-moz-box-shadow:0 1px 0 #ccc;
-webkit-box-shadow:0 1px 0 #ccc;
box-shadow: 0 1px 0 #CCCCCC;
font-family: arial,tahoma,verdana,sans-serif;
}


/* For radious */
footer, #Slider ,#Why_We, #Left_Search_box, #Right_Search_box, #container_100, .modalPop{
-moz-border-radius:5px 5px 5px 5px;
-webkit-border-radius:5px 5px 5px 5px;
border-radius:5px 5px 5px 5px;
}

/*This below code is for custom button*/ 
.customButton, .buttonWhite {
    padding:5px;
	color:#FFFFFF !important;
    background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #BD66E8), color-stop(1, #378de5) );
    background:-moz-linear-gradient( center top, #BD66E8 5%, #378de5 100% );
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#BD66E8', endColorstr='#378de5');
    background-color:#BD66E8;
    -moz-border-radius:6px;
    -webkit-border-radius:6px;
    border-radius:6px;
    border:1px solid #84bbf3;
    display:inline-block;
    font-family:arial;
    font-size:15px;
    font-weight:bold;
    text-decoration:none;
    text-shadow:1px 1px 0px #528ecc;
    cursor:pointer;
	min-width:120px;
	text-align:center;
}

.buttonWhite{
 background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f2f2f2), color-stop(1, #cccccc) );
    background:-moz-linear-gradient( center top, #f2f2f2 5%, #cccccc 100% );
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f2f2f2', endColorstr='#cccccc');
    background-color:#666666;
	color:#666666 !important;
    text-shadow:1px 1px 0px #aaaaaa;
    border:1px solid #bbbbbb;
}
.buttonWhite:hover{	color:#FFFFFF !important;}

.customButton:hover, .buttonWhite:hover {
    background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #378de5), color-stop(1, #BD66E8) );
    background:-moz-linear-gradient( center top, #378de5 5%, #BD66E8 100% );
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#378de5', endColorstr='#BD66E8');
    background-color:#378de5;
	color:#FFFFFF;

}




#Left_Search_box{
width:18%;
float:left;
margin-right:1%;
font-size:13px;
}




#container_100,#Left_Search_box{background:#f6f6f6;}



#Left_Search_box,{min-height:500px}


.light_header{background:#F2F2F2;padding:5px}

.Cur{cursor:pointer}
 
footer{
float:left;
background: #FFFFFF;
font-size:13px;
font-family:'Open sans', sans-serif;
padding: 5px;
}
.bold{font:bold;font-weight:bold}
.size12{ font-size:12px;}
.size14{ font-size:14px;}
.size16{ font-size:16px;}
.size18{ font-size:18px;}
.size20{ font-size:20px;}
.size1_1{font-size:1.1em}
.size1_2{font-size:1.2em}
.size1_5{font-size:1.5em}
.size2_5{font-size:2.5em}
.font-Left{text-align:justify}
.float-Right{float:right}
.float-Left{float:left}
#Align_R{float:right}
#Align_L{float:left}
.Text_L{text-align:left;text-align:justify;}
.Text_C{text-align: center;}
.width100{width:100%}
.width-res{width:95%}
.paddingRes{padding:5px}
.paddingItem{padding: 10px 20px 5px 20px}
.strike{text-decoration: line-through;} 
.w20p{min-width:20px !important}
.w100p{width:100px}
.width50{width:50%}
.width50-res{width:49%;float:left}
.width60{width:60%}
.width75{width:75%}
.width300px{width:300px}
.width400px{width:400px}
.gray{color:#707070}
.txtGreen{color:#60bf79}
.txtWhite{color:#FFFFFF}
.orange{color: orange;}
.bgWhite{background:white}
.txtBlue{color:#0000FF}
.txtBlck{color:#000000}
.txtDrkBlue{color:#0000AA}
.txtPurDrk{color:#560082}
.txtPurBrnd{color:#9000D9}
footer {background-color: #ddb2f3;}
.txtRed{color:#FF0000}
.txtMand{color:#FA7B0A};
.padding_L5{padding-left:15px;}
.hide{visibility:hidden;}
.marginTop5{margin-top:5px}
.margin5{margin:5px}
.margin10{margin:10px}
.grayBorder{border: 1px solid #ddd;} 
.divCenter{margin: auto;width:60%}

#cardReviewTable td {padding: 0px 0px 5px 10px}

#uploadImage{width:80%;}
.pad_u_d{padding:5px}


.whats-app {
	position: fixed;
    width: 50px;
    height: 50px;
    bottom: 40px;
    background-color: #25d366;
    color: #FFF;
    border-radius: 50px;
    text-align: center;
    font-size: 30px;
    box-shadow: 2px 2px 4px 4px #999;
    right: 15px;
    z-index: 100;

}


.menu_opt{display:none; position: absolute;background-color: #f9f9f9;z-index:500;}
.menu_cont:hover .menu_opt{display: block}

.menu_cont .menu_opt #UserVarMenu a{font-size:1.1em; padding:3px; color:#737373 !important; font-weight:600;display: block;}
.menu_cont .menu_opt #UserVarMenu a:hover{background:#eee;border-radius:5px;border: 1px solid black}


/* Footer grid design*/
.inFooter{
  display: grid;
  grid-template-areas:
    "footerMenu footerSocial"
    "footerCopy footerCopy";
 gap: 5px;}
.inFooter > div.footerMenu { grid-area: footerMenu;}
.inFooter > div.footerSocial {  grid-area: footerSocial;}
.inFooter > div.footerCopy { grid-area: footerCopy; }

.footerMenu {
  display: grid;
  grid-template-columns: auto auto auto auto;
  gap: 5px;
  font-size: 1.5em;
  font-weight: bold;
  gap: 5px;
}


/* Products list ProductsContainer grid for Items */
.ProductsContainer {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
	padding: 10px;
	}

/* Product grid*/

.productGrid{
  display: grid;
  grid-template-areas:
    "product_left product_right"
	"product_key product_more"
	;
grid-template-columns: 2fr 3fr;
 gap: 10px;
padding: 15px 50px 5px 50px;
}
.productGrid > div.product_left { grid-area: product_left;}
.productGrid > div.product_right {  grid-area: product_right;}
.productGrid > div.product_key {  grid-area: product_key;}
.productGrid > div.product_more {  grid-area: product_more;}






.ItemDet{float:left;padding-left:15px;width:25%}

.INR{background-image:url(../image/INR-small-darkgrey.png);background-position:left;background-repeat:no-repeat}
.box-border{position: relative; padding: 14px 18px;display: block; border-radius: 4px; border: 1px #ddd solid; background-color: #fff;}
.headText{font-size:3.5em;font-weight:bold;}
footer, #container{width:100%;}
#account_container{width:80%;padding:5px;float: right;}
.search{float:left; width:60%;padding-top:10px; z-index:700}
.main_menu{width:60%;padding:15px 15px 0px 15px;font-size:1.5em;}
#Header_Top_right{float:right;height:30px}
.recent{padding:8px;}
.ListItem{padding:10px;margin:5px;width:20%;background-color:#f2f3f4; border-radius:40px;font-size:1em;float:Left}
.ListItem:hover {color: rgba(80, 0, 80, 1); box-shadow: 0 5px 15px rgba(145, 92, 182, .4);}


.paging {font-size: 1.8em;margin: 10px 0px 10px 0px; width: 90%;}

.CartDropdown{padding:0px; width:40px;}
.cartOffer{display: inline-block;width:100px}
#cartTable th, #cartTable td {border-style: none none groove none}

@media screen and (min-width: 320px) and (max-width: 1023px) {
.inHeader,.inFooter, .inBody {padding: 1px;}
.TopHeader{height:90px;}
.ListItem{width:43%;padding:5px;}
.compare-grid-item{padding:2px 5px 5px 5px;}
.ProductsContainer {
	grid-template-columns: 50% 50%;
	}
	
.productGrid{
  display: grid;
  grid-template-areas:
    "product_left"
	"product_right"
	"product_key" 
	"product_more";
	grid-template-columns: 1fr;
	padding: 10px 10px 10px 10px;
	gap:10px;
}

.search,.ItemDet{width:90%;padding:5px;}
.itemImg {width:80%;}
.cartOffer{width:80px}
.main_menu{width:100%;padding:10px 10px 0px 10px;font-size:1.1em}
#browse_container{width:100%;padding:10px 1px;}
#Left_Search_box{display:none}
#account_container{width:99%;padding:5px;float: left;}
#Right_Search_box,.recent{float:left}
.HomeTopContainer{width:96%; padding:10px} 
.divCenter{width:88%}
.width50-res,.cartItems {width:100%;padding:5px;}

}

/*Screen for old Windows and iPhone, also for new iphone as validated */
@media screen and (min-width: 320px) and (max-width: 639px) {
.cart{width:36px;height:36px}
#Header_Top_right{width:40%;font-size:0.8em}
.ResHide{display:none}
.footerMenu { grid-template-columns: auto auto; font-size: 1.3em;}
}

/*Screen for latest Windows and iPhone */

@media screen and (min-width: 640px) and (max-width: 1023px) {
#Header_Top_right{width:40%;}
.headImg{width:70%;padding-left:100px}
.footerMenu { grid-template-columns: auto auto auto;}
}

/*Screen for iPad  */
@media screen and (min-width: 1024px) and (max-width: 1199px) {
.inHeader,.inFooter, .inBody {padding: 5px 10px;}
#Header_Top_right{width:20%}
.search{width:75%;}
.main_menu{width:60%;padding:15px 15px 0px 15px;font-size:1.5em;}
#Right_Search_box{width:20%;float:right}
.width-res{width:90%;}
.paddingRes{padding:15px}
#browse_container{padding:10px 1px;}
}

/*Screen for anything else */
@media screen and (min-width: 1200px){
.inHeader,.inFooter, .inBody,#browse_container{padding: 5px 40px 5px 40px;}
#Right_Search_box{width:20%;float:right}
.width-res{width:90%}
.paddingRes{padding:20px}
#Header_Top_right{width:18%}
.ItemDet{width:25%;padding:10px}
}