.productos {
	position: relative;
	width: 100%;
	font-size: 0;
	padding: 0 8px;
}



.gallery-item {
	margin: 12px 12px 0;
	display: inline-block;
	vertical-align: top;
	transition: .3s ease;
}
.group-tt {
	cursor: pointer;
	padding: 4px;
	border-radius: 4px;
	transition: .3s ease;
}
.group-tt:hover, .gallery-item.active .group-tt { background: #fff; }
.thumbnail {
	position: relative;
	width: 100%;
	height: 0;
	padding-top: 70%;
	overflow: hidden;
	border-radius: 2px;
	margin-bottom: 4px;
	background: #ccdce1;
}
.thumbnail > img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.picker img { display: none; }
.picker img:nth-child(1) { display: block; }
.prodname {
	width: calc(((100vw - 16px) / 5) - 29px);
	font-size: 1.25rem;
	color: #54708c;
	height: 32px;
}
.prodname p {
	float: left;
	width: 100%;
	height: 32px;
	margin: 0;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.prodname .p-cate { width: calc(100% - 2em); }
.plus {
	float: right;
	position: relative;
	margin: 0;
	height: 32px;
	width: 32px;
	box-shadow: -1px 0 1px -1px hsla(210,100%,10%,.5);
}
.plus * {
	display: block;
	position: absolute;
	background: #54708c;
}
.plus-h {
	width: 10px;
	height: 2px;
	top: 15px;
	left: 11px;
}
.plus-v {
	width: 2px;
	height: 10px;
	top: 11px;
	left: 15px;
}
.gallery-item.active .plus-v { display: none; }

.spawner { height: 16px; }



.gallery-expander {
	position: absolute;
	overflow: hidden;
	background: #01203f;
	left: 0;
	right: 0;
	margin-top: 0px;
	max-height: 0;
	transition: .3s ease;
}
.gallery-contents { position: relative; }
.gallery-contents:after {
	display: block;
	position: absolute;
	bottom: 0;
	left: 50%;
	margin-left: -12px;
	width: 0;
	height: 0;
	content: '';
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
	border-bottom-style: solid;
	border-bottom-color: #01203f;
	border-bottom-width: 0px;
	transition-delay: .3s;
	transition: .01s;

}
.gallery-item.active .gallery-contents:after { border-bottom-width: 8px; }
.gallery-expander-contents {
	padding: 8px;
}
.gallery-expander-contents:after {
	clear: both;
	display: table;
	content: '';
}
.gallery-expander-contents h3 {
	font-weight: 300;
	font-size: 1.3rem;
	color: #ebf2f5;
	margin: 0;
}
.gallery-expander-contents div.close  {
	position: absolute;
	top: 24px;
	right: 24px;
	color: #ebf2f5;
	text-shadow: none;
	opacity: 1;
	transition: .3s;
}
.gallery-expander-contents div.close:hover {
	color: #fff !important;
	opacity: 1 !important;
}



.subgallery-item {
	display: inline-block;
	vertical-align: top;
	background: #ebf2f5;
	margin: 0 12px 24px;
	border-radius: 4px;
	cursor: pointer;
	transition: .3s ease;
}
.neat-o {
	padding: 4px;
}
.subgallery-item:hover { background: #fff; }
.subgallery-item p {
	color: #54708c;
	font-weight: 500;
	font-size: .9rem;
	margin: 0;
	width: calc(((100vw - 16px) / 8) - 32px);
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}



@media screen and (max-width: 991px) {
	.gallery-item .prodname {
		width: calc(((100vw - 16px) / 4) - 29px);
	}
	.subgallery-item p { width: calc(((100vw - 16px) / 6) - 32px); }
}
@media screen and (max-width: 767px) {
	.gallery-item .prodname {
		width: calc(((100vw - 16px) / 3) - 29px);
	}
	.subgallery-item p { width: calc(((100vw - 16px) / 4) - 32px); }
}
@media screen and (max-width: 575px) {
	.gallery-item .prodname {
		width: calc(((100vw - 16px) / 2) - 29px);
	}
	.subgallery-item p { width: calc(((100vw - 16px) / 3) - 32px); }
}



/* THE MODAL */
.modal-header {
	padding: .5rem 0 0 .75rem !important;
	position: relative;
	height: 2.5rem;
	border-bottom: 0 !important;
	box-shadow: 0 1px 0 rgba(0,0,0,.05);
	z-index: 500;
}
.modal .close {
	color: #8fa3b3;
	position: absolute;
	top: 8px;
	right: 8px;
	opacity: .8;
	transition: .2s;
}
.modal .close:hover { color: #54708c !important; }
.modal .modal-title {
	color: #54708c;
	font-weight: 400;
	font-size: 1rem;
	margin: 0;
	width: calc(100% - 40px);
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.modal .modal-title i {
	font-size: .8rem;
	padding: 0 .7rem;
	color: #8fa3b3;
}
.modal-body {
	font-size: 0;
}
/* THE SLIDER */
.modal-body .owl-prev, .modal-body .owl-next { opacity: 0; transition: .2s; }
.modal-body:hover .owl-prev, .modal-body:hover .owl-next { opacity: 1; transition: .2s; }
.galcapwrap {
	position: relative;
	height: 1px;
	top: -1px;
	margin-bottom: -1px;
	/* background: rgba(0,0,0,.05); */
	background: rgba(10, 30, 50, 0.05);
}
.galcap {
	position: absolute;
	text-align: left;
	width: calc(100% - 8px);
	left: 4px;
	bottom: 0;
	color: #fff;
	/* background: rgba(0, 0, 0, 0.5); */
	background: rgba(10, 30, 50, 0.6);
	padding: 7px 10px;
	border-radius: 2px 2px 0 0;
	font-size: 14px;
	font-weight: 500;
	line-height: 17px;
}
.galcap:empty {
	display: none;
}
.galcapwrap:empty {
	display: none;
}



/* THE GALLERY */
/* THUMBNAILS */
.item {
  position: relative;
}
.thumbnails-wrapper {
  position: relative;
  top: 0;
  background-color: #a4b5c1;
  padding: 7px 3px 7px 7px;
  margin: 4px;
  border-radius: 0 0 2px 2px;
}
.thumbnails-wrapper .item {
  overflow: hidden;
  position: relative;
  margin: 3px;
  width: calc(100% - 10px);
  height: 0;
  padding-top: 70%;
  cursor: pointer;
  border-radius: 2px;
  border: 2px solid #fff;
  bottom: 0;
}
.perfiles .thumbnails-wrapper .item {
	padding-top: 80%;
	background: #ccdce1;
}
.perfiles .thumbnails-wrapper .item img {
	object-fit: cover;
}
.thumbnails-wrapper .item:hover {
  bottom: 2px;
  box-shadow: 0 1px 1px #54708c;
}
.thumbnails-wrapper .item img {
  position: absolute;
  width: 100%;
  height: 100%;
  object-fit: cover;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  filter: grayscale(.8);
  opacity: .8;
}
.thumbnails-wrapper .item:hover {
  bottom: 1px;
  box-shadow: 0 1px 1px #54708c;
}
.thumbnails-wrapper .item img:hover {
  filter: grayscale(0);
  opacity: 1;
}
.thumbnails-wrapper .synced .item {
  bottom: 0;
	pointer-events: none;
  border: 2px solid #01203f;
}
.thumbnails-wrapper .synced .item  img {
  filter: grayscale(0);
  opacity: 1;
}


.item img { cursor: pointer; }


/* IMAGE CAROUSEL NAVIGATION */
.main-carousel .item {
  position: relative;
  width: 100%;
	height: 0;
	padding-top: 75%;
}
.main-carousel .item img {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	object-fit: cover;
}
.perfiles .main-carousel .item {
	background: #ebf2f5;
	padding-top: 100%;
}
.perfiles .main-carousel .item img {
	object-fit: cover;
}
.main-carousel .owl-prev, .main-carousel .owl-next {
  position: absolute;
  top: 50%;
  transform: translate(0, -50%);
  font-size: 20px;
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  display: inline-block;
  color: #fff;
  padding: 4px 8px;
  margin: 0 4px;
  border-radius: 2px;
  /* background: rgba(0, 0, 0, 0.25); */
	background: rgba(10, 30, 50, 0.3);
  transition: .2s;
}
.main-carousel .owl-prev:hover, .main-carousel .owl-next:hover {
  /* background: rgba(0, 0, 0, 0.5); */
	background: rgba(10, 30, 50, 0.6);
  transition: .2s;
}
.main-carousel .owl-prev { left: 0; padding-right: 10px; }
.main-carousel .owl-next { right: 0; padding-left: 10px; }
.main-carousel .owl-prev:after, .main-carousel .owl-next:after {
}
.main-carousel .owl-prev:after { content: "\f053"; }
.main-carousel .owl-next:after { content: "\f054"; }
