.card {border-radius:5px;margin-top:2em;box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2); -webkit-box-flex: auto;-ms-flex: auto;flex: auto; width: 250px; margin: 2.5vw;background-color: #fff; overflow: hidden; }
.card-deck {  padding: .5vw;display: -ms-flexbox;-ms-flex-wrap: wrap;-ms-flex-direction: column;-webkit-flex-flow: row wrap; flex-flow: row wrap; display: -webkit-box;display: flex;}
.card:hover {box-shadow:  0 6px 20px 0 rgba(0, 0, 0, 0.19) !important; }
.card .img {height: 200px; overflow: hidden;}
.card-img {width: 100%;box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);margin-bottom: 20px;overflow: hidden;}
.card-img::before {background: url('/mutual/img/oferta.png') no-repeat;background-size: 100%;width: 150px;height: 100%;position: absolute;top: 0em;left: -2px;content: "";z-index: 99;}
.card-img img{width:100%;-webkit-transition: all 0.2s linear;-moz-transition: all 0.2s linear;-o-transition: all 0.2s linear;-ms-transition: all 0.2s linear;transition: all 0.2s linear; transform-origin:50% 100%;}
.card-caption {padding: 30px 15px 20px;position: relative;background: #efefef; height: 100%;}
.card-caption .icon-featured {padding: 6px 10px; font-size: 2em; background-color: #efefef; border-radius: 50%;position: absolute; top: 0; transform: translateY(-50%); right: 15px;}
.card-caption .icon-featured .icon {margin: 0;}
.featured {color: rgb(0,155,255) !important;}
.card a {color: #555;}
.card a:hover {text-decoration:none;color: #555;}
.news {margin-top: 2em; margin-bottom: 2em;/*min-height: calc(100vh - 266px);*/}
h2 {color: rgb(0,155,255);}
.card .card-caption h2 {font-size: 1.5em; line-height: 1.5em;}
.art-date {font-size: .9em !important;color: #a1a1a1 !important; margin-bottom: 5px !important;}
.card .card-caption .card-title {}
.div-date {height: 20px;position: relative;}
.art-date {}
.card .card-caption .card-content {position: relative;}

.ofertas {padding-bottom: 20px;}

.carousel-caption {right: 0;left: 0;padding-bottom: 30px;top: 50%;bottom: auto;background: rgba(255,255,255,.85);transform: translateY(-50%);}
.carousel-caption p {position: relative;left: 50%;width: 90%;transform: translateX(-50%); -webkit-transform: translateX(-50%); color:#333; text-shadow:none;}
.carousel-caption h3 {font-size: 2rem;text-shadow:1px 1px #000;color:rgb(0,155,255); text-transform:uppercase;}
.carousel-caption a {text-decoration: none !important;color: #fff;padding: 1rem 2em;background:rgb(0,155,255);border-radius: 2px;text-shadow:none;box-shadow:2px 2px 10px rgba(0,0,0,.2);}
.carousel-caption a:hover {text-decoration: none !important;background-color: #fff;color:#aaa;padding: 1rem 2em;}
.carousel-indicators li {display: inline-block;width: 50px;height: 4px;margin: 1px;text-indent: -999px;cursor: pointer;background-color: #fff;border-radius: 10px;border:0;}
.carousel-indicators .active {width: 50px;height: 4px;background-color: rgb(0,155,255);margin:1px;}
.item video {width:100%;}
.carousel-control {margin:0;}
.carousel-control i {position: absolute;top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); left:0;font-size: 2em;}
.carousel-control.right i {left: auto; right: 0;}
.carousel-img {height: 250px; width: 100%;}
.carousel-inner {height: calc(100vh - 60px);}
.carousel-inner .item {height: 100%;}

.resume-card {text-align: center; margin-bottom: 1em;}
.resume-card .resume-inner .icon {font-size: 4em;color: rgba(0,0,0,0.1);float: right;}
.resume-card .resume-inner h1 {font-size: 3em; font-weight: 100;}
.resume-card .resume-inner {color: #fff; border-radius: 3px;box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);padding: 1.5em 0em;}
.resume-card .user {background-color: #e84c3d;}
.resume-card .articles {background-color: #1abc9c;}
.resume-card .sliders {background-color: #3598db;}
.resume-card .pages {background-color:#3598db;}
.resume-card .visitors {background-color: #9a59b5;}

.btn-tt {background: rgb(242,195,1);border: none;color: rgba(0,0,0,.75);}
.btn-tt:hover {background: rgb(235,175,0);}

.gallery { 
  padding: .5vw;
  font-size: 0;
  display: -ms-flexbox;
  -ms-flex-wrap: wrap;
  -ms-flex-direction: column;
  -webkit-flex-flow: row wrap; 
  flex-flow: row wrap; 
  display: -webkit-box;
  display: grid;
  grid-template-columns: repeat(3,1fr);
}
.gallery div { 
  -webkit-box-flex: auto;
  -ms-flex: auto;
  flex: auto; 
  width: 200px; 
  margin: .5vw;
  position: relative;
}
.gallery div img { 
  width: 100%; 
  height: auto; 
}

.gallery img {
	max-height: 80px !important;
	margin: 5px !important;
	float: left !important;
}

.gallery .portada {
	max-height: 200px !important;
	margin: 5px !important;
	float: left !important;
	width: auto;
}


.upload-photos { 
  padding: .5vw;
  font-size: 0;
  display: grid;
  grid-template-columns: repeat(3,1fr);
}
.upload-photos div { 
  -webkit-box-flex: auto;
  -ms-flex: auto;
  flex: auto; 
  width: 200px; 
  margin: .5vw;
  position: relative;
}
.upload-photos div img { 
  width: 100%; 
  height: auto; 
}

.upload-photos img {
	max-height: 80px !important;
	margin: 5px !important;
	float: left !important;
}

.upload-photos .portada {
	max-height: 170px !important;
	margin: 5px !important;
	float: left !important;
	width: auto;
}

.label-portada {
  display: block;
  position: absolute;
  bottom: 1em;
  left: 1.5em;
  background: #373039;
  padding: 0 .25em;
  color: rgba(255,255,255,.7) !important;
}

/*#####################*/
/*	 Categorias	  */
/*#####################*/

.card-cat {height: 250px;transition: all .5s ease-in-out;-webkit-transition: all .5s ease-in-out;}
.card-cat-home {height: 150px  !important;width: 150px !important;margin: 0 !important;border-radius: 0 !important;box-shadow: none !important;border:1px solid #eae6e6;}
.card-cat .cat-name {height: 50%;width: 100%;text-align: center;position: relative;transition: all .5s ease-in-out;-webkit-transition: all .5s ease-in-out;}
.card-cat .cat-img {height: 50%;width: 100%;text-align: center;position: relative;background-color: rgba(0,0,0,.25);transition: all .5s ease-in-out;-webkit-transition: all .5s ease-in-out;}
/*.card-cat:hover {background-color: rgba(0,0,0,.2);}*/
.card-cat:hover > .cat-name h1 {color:#f00 !important;}


.card-cat .cat-name h1 {position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);font-size: 1em;text-transform: uppercase;letter-spacing: 5px; font-weight: 100;transition: all .5s ease-in-out;-webkit-transition: all .5s ease-in-out;width: 100%;padding: .4em 0 .2em;}



/*carrito*/
.img-carrito {max-height: 120px; max-width: 100%;}
.cart-product {margin-bottom: 15px; border-bottom: 1px solid #c1c1c1;}
.cart-product h4 {line-height: 2em; color: #555 !important;}
.sub-total h2 {color: #555 !important; font-size: 18px;}
#cant_carrito_mob, #cant_carrito {
	padding: 5px;
	background: rgb(235,195,0);
	color: #333;
	border-radius: .1em;
}

.cantCarrito {
	text-align: center;
	border: none !important;
	border-radius: 0;
	width: 40px;
	height: 31px;
	background: white !important;
}

.cantCarrito.carro {
	text-align: center;
	border: 1px solid #a1a1a1 !important;
	width: 40px;
	height: 32px;
	background: white !important;
	border-radius: 3px;
}

.cart-sign {
	/*border: 1px solid;*/
	border: 1px solid;
	padding: 6px 5px;
	margin: 0;
	line-height: 32px;
	cursor: pointer;
	border-radius: 3px;
}

.cart-sign i {
	font-size: 16px;
	margin: 0 !important;
}

.carrito {
	background: white !important;
}

.cartTitle h4 {
	display: block;
	display: -webkit-box;
	max-width: 400px;
	margin: 0 auto;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}

.sub-total h2, .sub-total h3 {
	color: #000 !important;
}
.sub-total {
	background: rgb(235,193,0);
	padding: 10px;
	border-radius: 5px;
}

@media screen and (max-width: 400px) {
  .gallery div { margin: 0; }
  .gallery { padding: 0; }
  
}



@media (min-width:480px){
	
}


@media (min-width:768px){
	.carousel-caption h3 {font-size: 4rem;}
	.carousel-caption p {width: 50%;}
	.carousel-img {height: 350px; width: 100%;}
	.card {margin: .5vw;width: 230px;}
	.resume-card .resume-inner .icon {font-size: 5em;}
	.cantCarrito.carro {padding-left: 11px;}

}


@media (min-width:992px){
	
}
@media (min-width:1280px){
	
  .card {width: 250px;}
  .card-cat {height: 300px}
  .cat-card {flex: none;}
}

@media (min-width:1600px){
	.card {width: 360px;}
  .card-cat {height: 360px} 
}