.header{position:fixed; width:100%; height:8.5rem; top:0px; left:0px; padding:0; border-bottom:1px #e2e2e2 solid; z-index:9; background-color:#fff;}
.header a{color:var(--footer_fore); font-size:0.9rem;}
.htop{position:relative; display:block; width:100%; height:2rem; background-color:#CE2934; color:#fff; }
.icon{
  position:absolute; top: 0;
  width:auto; height:2rem; cursor:pointer;
  display: flex; justify-content: center;  align-items: center;
  border: 0px solid red;
}
.icon img{position:relative; max-width:80%; max-height:80%;} 
.celu{ right:15%;}

.wa{right:10%;}
.fk{right:7%;}
.insta{right:4%;}

.envios{ left:20%;}
.label{
  position:absolute; top: 0;
  width:auto; height:2rem; cursor:pointer;
  display: flex; justify-content: center;  align-items: center;
  border: 0px solid red;
}

.hcenter{position:relative; display:block; width:100%; height:6.5rem; background-color:#fff; }
.logo{
  position:absolute; width:25%; height:6rem; top: 0; left:1%; cursor:pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  border: 0px solid red;
}
.logo img{position:relative; max-width:80%; max-height:80%;} 


.buscar{
  position:absolute; width:40%; height:2.5rem;
  top:0.8rem; left:30%;
  border-radius: 25px; -webkit-border-radius: 25px; -moz-border-radius: 25px;
  border:1px solid #e1e1e1; background-color:#fff;
}
.buscar *{position:absolute;}
.buscar input{
  border-radius: 25px; -webkit-border-radius: 25px; -moz-border-radius: 25px;
  top:0.1rem; left:0%; 
  width:85%; height:2.2rem; 
  font-size:1.1rem;
  padding-left:25px;
  border:0;
}
.buscar i{ top:0.4rem; right:3%; font-size:1.9rem; cursor:pointer; z-index:999; color:#006080;}




.catalogo{position:absolute;
  width:10%; height:1.4rem; 
  top:4.2rem; left:30%;
  overflow:hidden; 
}
.catalogo:hover{ border-bottom:1px solid #f1f1f1; font-weight:400;}
.catalogo *{position:absolute; cursor:pointer; }
.catalogo label{top:0.1rem; left:22%; width:70%; height:1.3rem; font-size:0.9rem;}
.catalogo i{ top:0.1rem; left:1%; width:auto%; height:1.3rem; font-size:1.2rem; color:#999;}

._canasto{position:absolute; top:1.4rem; right:3%; font-size:2rem;color:#c0c0c0; cursor:pointer;}
._animar{
	-webkit-animation-name: animar; -webkit-animation-duration: 2s;
	animation-name: animar;         animation-duration: 2s;    
	animation-iteration-count: 2; 	-webkit-animation-iteration-count: 2;
}
@keyframes animar{
    from{transform:scale(1); color:#c0c0c0;}
    25% {transform:scale(1.2); color: red;}
    50% {transform:scale(1); color: #c0c0c0;}
    75% {transform:scale(1.2); color:red;}
    to  {transform:scale(1); color: #c0c0c0;}
}
._canasto:hover{transform:scale(1.1); color:var(--sis_fore);}

._canasto_qty{position:absolute; top:2.4rem; right:2.5%; font-size:0.8rem;color:#c0c0c0; cursor:pointer;}

._login{position:absolute; top:1.3rem; left:75%; font-size:2rem;color:#c0c0c0; cursor:pointer;}
._user{
  position:absolute; top:1.9rem; left:79%; font-size:1rem;color:#c0c0c0; cursor:pointer; 
  display: -webkit-box; height:1.3rem; text-align:left; text-overflow: ellipsis; overflow:hidden; -webkit-line-clamp: 1; -webkit-box-orient: vertical;
  max-width:8%; width:auto; max-height:1.4rem;
}
.h{transition: all 0.6s ease-in-out;}
.h:hover{ transform:scale(1.1);}

.contacto{position:absolute;cursor:pointer;
  width:10%; height:1.4rem; 
  top:4.2rem; right:2%;
  overflow:hidden; 
}
.nosotros{position:absolute;cursor:pointer; text-align:center;
  width:13%; height:1.7rem; 
  top:4rem; right:15%;
  overflow:hidden; padding-top:4px; color:#fff; font-weight:500;
  background-color:#2d5f97;   border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px;
}
.expand{max-height:32rem!important; padding-left:15px!important; padding-top:1rem!important; padding-bottom:1rem!important;}
.secciones{
  position:absolute; float:left; margin:0; padding:0; z-index:9200;
  top:8rem; left:6%;
  border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px;
  display:grid;
  grid-template-columns: repeat(1, 1fr);
  gap:5px;
  /* width:48%;  */
  width:28%; 
  height:auto; max-height:0px; transition: all 0.6s ease-in-out;
  background-color:#fff; color:#000;
  overflow-y:auto;
}
.secciones li{list-style-type:none; font-size:0.9rem; padding-top:0.1rem; padding-left:1%;}
.secciones li:hover{ cursor: pointer; font-weight:bold;}

.rubros{
  position:absolute; float:left; margin:0; padding:0; z-index:9200;
  top:8rem; left:34.1%;
  /* top:8rem; left:54.1%; */
  border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px;
  display:grid;
    grid-template-columns: repeat(1, 1fr);
    gap:5px;
  height:auto; width:40%; max-height:0px; transition: all 0.6s ease-in-out;
  background-color:#fff; color:#000;
  overflow-y:auto;
  
}

.rubros li{list-style-type:none; font-size:0.9rem; padding-top:0.1rem; padding-left:1%;}
.rubros li:hover{ cursor: pointer; font-weight:bold;}

.canasto{
  position:absolute; top:0; right:0%; width:0%; height:100dvh; z-index:9999;
  transition: all 0.6s ease-in-out; 
  border:0px solid red; background-color:var(--sis_back);
  overflow:auto;
}
.show_cnt{width:30%!important;padding:10px;}

.mnu_user{
  position:absolute; top:0; right:0%; width:0%; height:99.5dvh; z-index:9999;
  transition: all 0.6s ease-in-out; 
  border:0px solid red; background-color:var(--sis_back);
  overflow:hidden;
}
.show_user{width:25%!important;padding:0px;}
/*.mnu_user{
  position:absolute; margin:0; padding:0; z-index:9200;
  top:5.6rem; left:74%;
  border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px;
  display:grid;
  grid-template-columns: repeat(1, 1fr);
  gap:5px;
  height:auto; width:16%; max-height:0px; transition: all 0.6s ease-in-out;
  background-color:#fff; color:#000;
  overflow-y:auto;
}*/
/*
.mnu_user li{list-style-type:none; font-size:0.9rem; padding-top:0.1rem; padding-left:1%;}
.mnu_user li:hover{ cursor: pointer; font-weight:bold;}
.mnu_user label{font-size:1rem; padding-top:0.1rem; padding-left:1%; width:100%; font-weight:500;}
*/
/* .mnu_user *{display:none;} */

.user_perfil{
  position:relative;
  display:block; width:100%; float:left; height:3rem;
  border:0px solid gray;
  padding:20px; 
}
.user_perfil *{position:absolute;cursor:pointer;}
.user_perfil:hover{background-color:#f1f1f1;}

.user_perfil nav{
  top:0.5rem; left:15px; width:35px;  height:35px;
  display:grid; 
  border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%;
  border:1px solid gray;
  justify-content: center;
  align-items: center;
}
.user_perfil label{
  top:0.3rem; left:60px; width:calc(100% - 45px); height:35px; font-size:20px;
}
.user_perfil div{
  top:1.7rem; left:65px; width:calc(100% - 45px); font-size:12px;
}
.user_nav{
  position:relative;  cursor:pointer;
  display:block; width:100%; float:left; height:2rem; margin-top:0.5rem;
  padding-left:35px; padding-top:10px;
  border:0px solid gray;
}
.user_nav:hover{background-color:#f1f1f1;}


#user_sepa{
  position:relative;
  display:block; width:96%; float:left; height:1rem; margin-top:0.5rem;margin-left:2%;
  border-bottom:1px solid gray;
}

/* CANASTO FLOTANTE*/
.canasto_title{
  position:relative; background-color:var(--sis_back); 
  height:2rem; max-height:2rem; overflow:hidden;
  display:block; margin-top:1rem;
}
.canasto_title label{position:absolute; top:0.5rem; left:4%; font-size:1.2rem; font-weight:500;}
.canasto_title i{position:absolute; top:0.3rem; right:2%; cursor:pointer; }
.skin_cnt{
  position:relative; background-color:var(--sis_back); 
  height:7rem; max-height:30rem; overflow:hidden;
  display:block; margin-top:1rem;
}

.skin_cnt:hover{
  /* max-height:25rem;  */
}

.skin_cnt .cnt_img{
  position:absolute; top:0.5rem; left:1%;
  width:30%; height:5rem; cursor:pointer; 
  display: flex; justify-content: center;  align-items: center;
  border: 0px solid green;
}
.cnt_img img{position:relative; max-width:95%; max-height:95%;} 

.cnt_title{
  position:absolute; top:0.2rem; left:31%; width:60%;
  font-size:0.75rem; 
  display: -webkit-box; height:2.3rem; text-align:left; text-overflow: ellipsis; overflow:hidden; -webkit-line-clamp: 2;    -webkit-box-orient: vertical;
  padding:8px; font-weight:400;
}
._delete{
  position:absolute; top:1rem; left:90%; width:10%;
  font-size:1.8rem; 
  text-align:center; cursor:pointer; 
}
.cnt_qty{
  position:absolute; top:3rem; left:35%; width:25%; height:2.2rem; 
	border-radius: 15px; -webkit-border-radius: 15px; -moz-border-radius: 15px;
  padding:5px; 
  border: 0px solid blue; 
}
.cnt_qty input{border:0; width:95%; font-size:1.2rem; text-align:center!important;}
.cnt_precio{
  position:absolute; top:3.3rem; left:60%; width:38%;
  font-size:1rem; 
  height:1.3rem; text-align:right; 
  padding:5px; font-weight:500;
}
.balance{
  position:relative; background-color:var(--sis_back); 
  height:2rem; max-height:2rem; overflow:hidden;
  display:block; margin-top:1rem;
}
.balance label:nth-child(1){position:absolute; top:0.5rem; left:4%; font-size:1rem; font-weight:400; width:40%;}
.balance label:nth-child(2){position:absolute; top:0.5rem; left:44%; font-size:1rem; font-weight:500; width:50%; text-align:right;}
/*
.check_out{ 
  position:relative; 
  height:2rem; width:60%; margin-left:20%; padding-top:6px;
  display:block; margin-top:1rem; font-weight:500;
}

.back_close{
  position:relative; background-color:var(--sis_back); height:2rem; width:80%; margin-left:10%;
  display:block; margin-top:1rem; text-align:center; cursor:pointer;
}
*/

@media only screen and (min-width : 300px) and (max-width : 580px){
}