.carrito{
	width: 100%;
	position: fixed;
	display:flex;
	z-index: 5;
	margin-top: 5px;


}
.carrito1{
cursor:pointer;
	width:50px; height:50px;

}
.carrito2{
cursor:pointer;
	width:50px; height:50px;
}


.carrito4{
cursor:pointer;
margin-left: 20px;

}
@keyframes mensaje {
  50% { width:100%; height:60%; }
  100% { width:100%; height:0px;  }
}

.mensaje{
	z-index:7;
width:100%; height:0px;
top:0px;


	 position: fixed;
display:flex;
overflow: hidden;



border-radius: 20px;
	font-size:18px;
	font-family:Arial, Helvetica, sans-serif;

	align-items: center; align-content: center;




	 text-align: justify;

	 background: rgb(249, 48, 4);
	 color: white;


	 animation-name: mensaje;
 animation-duration: 4s;
}
.mensaje3{margin: auto;padding: 10px;}




@keyframes ejemplo {


  50% {width:70%; height:70%;}
  100% {width: 0px;   height: 0px; }
}

.caja{
	z-index:7;
	width:0px;
	height:0px;
	position: fixed;
border-radius: 20px;
	font-size:18px;
	font-family:Arial, Helvetica, sans-serif;
	 text-align: justify;
	 padding: 8px;
	 background: url('imagenes/carro1.png')  no-repeat;
    background-size: contain;
	 animation-name: ejemplo;
 animation-duration: 4s;
}

@media screen and (max-width: 768px){


}
.categorias{

	border-radius: 10px;

display: grid;
grid-template-areas: "cate1 cate2 cate3"
                     "cate4 cate5 cate6"
                      ;
											grid-gap: 15px;
											margin: 20px;
}
.categorias > div {
border-radius: 10px;
border: 1px solid rgba(12,170,246,.93) ;

padding:10px;
}
@media (max-width: 800px) {
.categorias{
	grid-template-areas: "cate1" "cate2" "cate3" "cate4" "cate5" "cate6"
	                      ;
	}
}

@media(max-width:1000px) and (min-width:801px) {
.categorias{
	grid-template-areas: "cate1 cate2" "cate3 cate4" "cate5 cate6"
	                      ;
	}
}





a { text-decoration: none;}

A:link {text-decoration: none }
A:visited { text-decoration: none }

img {
  height: auto;
   width: 100%;
   vertical-align:middle;
}
*{
	margin:0px;
	padding:0px;
	list-style:none;
	text-decoration:none;
	font-family:Arial;
	box-sizing: border-box;
	}



.fila{
	position:relative;
	margin:auto;
	width:100%;
	height:100%;
	clear:both;
	display:table;
	}
[class*="col-"]{
	float:left;

}
/*pantalla de escritorio grande*/
@media(min-width:1200px){
.col-lg-12{width:100%;}
.col-lg-11{width:91.66666667%;}
.col-lg-10{width:83.33333333%;}
.col-lg-9{width:75%;}
.col-lg-8{ width: 66.66666667%; }
.col-lg-7{width:58.33333333%;}
.col-lg-6{width:50%;}
.col-lg-5{ width: 41.66666667%; }
.col-lg-4{width:33.33333333%;}
.col-lg-3{ width: 25%; }
.col-lg-2{width:16.66666667%;}
.col-lg-1{width:8.33333333%;}
}
/*pantalla de tablet mediana*/
@media(max-width:1199px) and (min-width:992px) {
.col-md-12{width:100%;}
.col-md-11{width:91.66666667%;}
.col-md-10{width:83.33333333%;}
.col-md-9{width:75%;}
.col-md-8{ width: 66.66666667%; }
.col-md-7{width:58.33333333%;}
.col-md-6{width:50%;}
.col-md-5{ width: 41.66666667%; }
.col-md-4{width:33.33333333%;}
.col-md-3{ width: 25%; }
.col-md-2{ width: 16.66666667%;}
.col-md-1{ width: 8.33333333%; }
}
/*pantalla de tablet pequeña */
@media(max-width:991px) and (min-width:768px) {
.col-sm-12{width:100%;}
.col-sm-11{width:91.66666667%;}
.col-sm-10{width:83.33333333%;}
.col-sm-9{width:75%;}
.col-sm-8{ width: 66.66666667%; }
.col-sm-7{width:58.33333333%;}
.col-sm-6{width:50%;}
.col-sm-5{ width: 41.66666667%; }
.col-sm-4{width:33.33333333%;}
.col-sm-3{ width: 25%; }
.col-sm-2{ width: 16.66666667%;}
.col-sm-1{ width: 8.33333333%; }
}
/*pantalla de ceular  extra pequeña */
@media(max-width:767px)  {
.col-xs-12{width:100%;}
.col-xs-11{width:91.66666667%;}
.col-xs-10{width:83.33333333%;}
.col-xs-9{width:75%;}
.col-xs-8{width: 66.66666667%; }
.col-xs-7{width:58.33333333%;}
.col-xs-6{width:50%;}
.col-xs-5{width: 41.66666667%; }
.col-xs-4{width:33.33333333%;}
.col-xs-3{width: 25%; }
.col-xs-2{width: 16.66666667%;}
.col-xs-1{width: 8.33333333%; }
}