[data-title] {
  position: relative;

}

[data-title]:hover::before {
  content: attr(data-title);
  position: absolute;
  bottom: -26px;
  display: inline-block;
  padding: -2px 22px 0px 22px;
  border-radius: 2px;
  background: #000;
  color: #fff;
  font-size: 10px;
    line-height: 20px;
  white-space: nowrap;
    width: 150px;
    
}
[data-title]:hover::after {
  content: '';
  position: absolute;
  bottom: -10px;
  left: 4px;
  display: inline-block;
  color: #fff;
  border: 8px solid transparent;	
  border-bottom: 8px solid #000;
}
.lacajita{
    cursor: pointer;
}
.chacho{
	width: 20px;
	height: 20px;
	background-color: #4028C7;
}
.gallery-filter a{
	width:33.3%;
	padding:5px;
	display:block;
	transition:height 350ms ease;
	height: 257px;
}


.paraelfondo{
	margin: 0 auto; 
	/*background-image:url(../images/renders/living-5/fondo.png); */
	background-size: cover;
	background-position: center; 
	
}

#bt {
  -moz-transition: transform 1s;
  -webkit-transition: transform 1s;
  transition: transform 1s;
}

.flip {
  transform: rotate(-180deg);
}
#aca{
	/*margin-top: 300px;*/
}

.bordeFotos{

    width: 100%;
    text-align: center;
    z-index: 9;
    position: fixed;
    background-color: rgb(255, 255, 255);
    padding: 5px;
    margin-left: -20px;
    margin-top: -45px;
	box-shadow: 0px 1px 10px #999999;
}


.bg-gray-dark {
    margin-bottom: 2px;
}
.accordion-style-2 a {
    padding: 0px 10px 0px 20px;
    height: 50px;
    line-height: 50px;
    /* border-bottom: solid 1px #fff; */
    margin-bottom: 16px;
}
.elbordeTituloPaleta{
	width: 100%; 
	height: 20px; 
    color: #4E4E4E;

}
.elbordePleta{
	height: 43px; 
	margin-top:20px; 
	border: solid 1px rgba(0,0,0,0.2);
    border-radius: 7px;
	margin:0 auto;
    margin-bottom: 2px;
}
.cajasuperioriz{
	width: 10%;
    float: left;
	margin-left: 10px;
	text-align: left;
	line-height: 15px;
}
.cajasuperiorder{
	width: 10%;
    float:right;
	margin-right: 10px;
	text-align:right;
	line-height: 15px;

}
.cajasuperiocent{
	width: 30%;
    float:left;
    margin:0 auto;
	line-height: 15px;
}

.lacajitaselect {
    border: 4px #635f5f solid;
    border-radius: 6px;
	color: rgba(255,255,255,1.00);
}
.muestra2 {
    margin-top: 10px;
    height: 24px;
    width: 194px;
    margin-bottom: -20px;
    /*background-image: linear-gradient(to right, rgba(255,200,0,1), rgba(255,0,0,1));*/
    z-index: 9999;
    margin-left: 10px;
}
.muestra {
    margin-top: 10px;
    height: 24px;
    width: 194px;
    margin-bottom: -37px;
    /* background-image: linear-gradient(to right, rgba(255,200,0,1), rgba(255,0,0,1)); */
    z-index: 9;
    margin-left: 10px;
    border: solid 1px #fff;
    border-radius: 14px;
}
.pn-ProductNav {
  /* Make this scrollable when needed */
  overflow-x: auto;
  /* We don't want vertical scrolling */
  overflow-y: hidden;
  /* Make an auto-hiding scroller for the 3 people using a IE */
  -ms-overflow-style: -ms-autohiding-scrollbar;
  /* For WebKit implementations, provide inertia scrolling */
  -webkit-overflow-scrolling: touch;
  /* We don't want internal inline elements to wrap */
  white-space: nowrap;
  /* Remove the default scrollbar for WebKit implementations */
}
.pn-ProductNav::-webkit-scrollbar {
  display: none;
}

.pn-ProductNav_Link {
  text-decoration: none;
  color: #888;
  font-size: 1.2em;
  font-family: -apple-system, sans-serif;
  display: inline-flex;
  align-items: center;
  min-height: 44px;
}
.pn-ProductNav_Link + .pn-ProductNav_Link {
  margin-left: 11px;
  padding-left: 11px;
  border-left: 1px solid #eee;
}
.pn-ProductNav_Link[aria-selected="true"] {
  color: #111;
}


.grid__item {
	font-size: 14px;
	display: inline-block;
	/*margin: 0.4em 0.4em;
	padding-top: 1.00em;*/
	width: 5em;
	height: 5em;
	border-radius: 4px;
	background: #403E45;
	color: #000;
	text-align:center;
	vertical-align:baseline;
	z-index: 999999999;

}
.grid {
	margin: 0 auto;
	max-width: 50em;
	padding: 0 1em;
}



.grid__item:hover {
	cursor: move;
	cursor: -webkit-grab;
	cursor: grab;
}

.grid__item:active {
	cursor: -webkit-grabbing;
	cursor: grabbing;
}

.is-dragging {
	background: #4e4c52;
}

.is-active {
	z-index: 100;
}

.is-dropped {
	opacity: 0;
	-webkit-transform: scale3d(0.7,0.7,1) !important;
	transform: scale3d(0.7,0.7,1) !important;
}

.is-complete {
	opacity: 1;
	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s !important;
	transition: opacity 0.3s, transform 0.3s !important;
	-webkit-transform: scale3d(1,1,1) !important;
	transform: scale3d(1,1,1) !important;
}

.animate {
	-webkit-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}

.drop-area {
	position: fixed;
	bottom: 0px;
	left: 0;
	z-index: 199;
	width: 100%;
	height: 55px;
	background: rgba(255,255,255,1.00);
	text-align: center;
/*	-webkit-transition: -webkit-transform 0.5s cubic-bezier(0.6,0,0.4,1);
	transition: transform 0.5s cubic-bezier(0.6,0,0.4,1);
	-webkit-transform: translate3d(0,20px,0);
	transform: translate3d(0,20px,0);
	    box-shadow: 0px -5px 30px #888888;*/
}
.minuevadrop-area {
	position: fixed;
	bottom: 0px;
	left: 0;
	z-index: 99;
	width: 100%;
	height: 55px;
	background: rgba(255,255,255,1.00);
	box-shadow: 0px 1px 10px #999999;
	
	text-align: center;
/*	-webkit-transition: -webkit-transform 0.5s cubic-bezier(0.6,0,0.4,1);
	transition: transform 0.5s cubic-bezier(0.6,0,0.4,1);
	-webkit-transform: translate3d(0,20px,0);
	transform: translate3d(0,20px,0);*/
}

/*.drop-area.show {
	-webkit-transform: translate3d(0,-30%,0);
  transform: translate3d(0,-30%,0);
}*/

.drop-area > div {
	width: 100%;
	height: 0%;
	-webkit-transition: -webkit-transform 0.4s 0.3s;
	transition: transform 0.4s 0.3s;
	-webkit-transform: translate3d(0,20%,0);
	transform: translate3d(0,20%,0);
}

/*.drop-area.show > div {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}*/


.drop-area__item {
	position: relative;
	display: inline-block;
	


	border-radius: 2px;
	background: rgba(0,0,0,0.5);
/*	-webkit-transition: -webkit-transform 0.3s, background 0.3s;
	transition: transform 0.3s, background 0.3s;
	-webkit-backface-visibility: hidden;*/
}
.minuevodrop-area__item {

	position: relative;
	display: inline-block;

	border-radius: 2px;
	background: rgba(0,0,0,0.5);
	
}

.drop-area__item.highlight {
	background: rgba(0,0,0,0.15);
	-webkit-transform: scale3d(1.08,1.08,1);
	transform: scale3d(1.08,1.08,1);
}

.drop-area__item::before,
.drop-area__item::after {
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	color: rgba(0,0,0,0.15);
	font-size: 1.5em;
	margin-top: -0.35em;
	font-family: 'Font Awesome\ 5 Free';
	pointer-events: none;
}

.drop-area__item::before {
	content: "\f28d";
}

.drop-feedback.drop-area__item::before {
	opacity: 0;
	-webkit-transform: scale3d(0,0,1);
	transform: scale3d(0,0,1);
}

.drop-area__item::after {
	font-family: 'Font Awesome\ 5 Free';
	color: rgba(255,253,197,0.6);
	content: "\f28d";
	font-size: 10em;
	margin-top: -0.1em;
	margin-left: -0.35em	;
	opacity: 0;
	-webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
	transition: opacity 0.3s, transform 0.3s;
	-webkit-transform: scale3d(2,2,0);
	transform: scale3d(2,2,0);
	color: rgba(255,255,255,1.00);
}

.drop-feedback.drop-area__item::after {
	opacity: 1;
	-webkit-transform: scale3d(1,1,1);
	transform: scale3d(1,1,1);
}

/*.dummy,
.dummy::after {
	position: absolute;
	top: 100%;
	left: 0;
	margin: 0.25em 0;
	height: 0.65em;
	border-radius: 2px;
	background: rgba(0,0,0,0.15);
	-webkit-backface-visibility: hidden;
}

.dummy {
	width: 90%;
}

.dummy::after {
	width: 60%;
	content: 'fsfsd';
}*/

.drop-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.1);
	opacity: 0;
	-webkit-transition: opacity 0.1;
	transition: opacity 0.1;
	pointer-events: none;
}

.drop-area.show + .drop-overlay {
	opacity: 1;
}

.helper {
	position: absolute !important;
	margin: 0;
}

@media screen and (max-width: 50em) {
	.grid__item {
		font-size: 12px;
	}
	.drop-area {
		font-size: 0.6em;
	}
}

@media screen and (max-width: 25.5em) {
	.grid {
		padding: 0 2em;
	}
	.grid__item {
		font-size: 1em;
	}
}

/*/////////////////////////////*/

@media(min-width:320px) and (max-width:375px){
	.pepe{
		background-color:aqua;
	}
	.medida{
		width: 240px; 
		height: 135px;
	}
	.elalto{
		margin-top: -135px
	}
    .lacajita{
	width: 16px;
	height: 30px; 
	background-color: rgba(202,195,38,1.00); 
	display: inline-block;
	float:left; 
	margin: 5px 2px 5px 2px;
    font-size: 5px;
        
}
    .elMargen{
	margin-top: 10px;
}
    .cajatestigos{
	width: 30px; 
	height: 30px; 
	border: solid thin rgba(255,255,255,1.00); 
	position: absolute;
    font-size: 8px;
	
}
    .container {
    margin-top: -40px;
}
    .elbordePleta, .cajaTitulo{
width: 260px; 
    }
    .nueva{
   	width: 23px;
	height: 40px; 
    margin: 7px 3px 5px 2px;
}
    .header-logo{left:0px!important; }
	}
@media(min-width:375px) and (max-width:425px){
	.pepe{
		background-color:red;
	}
	.medida{
		width: 300px; 
		height: 169px;
	}
	.elalto{
		margin-top: -169px
	}
    .lacajita{
	width: 20px;
	height: 30px; 
	background-color: rgba(202,195,38,1.00); 
	display: inline-block;
	float:left; 
	margin: 7px 2px 6px 2px;
    font-size: 7px;
}
    .elMargen{
	margin-top: 50px;
}
    .cajatestigos{
	width: 50px; 
	height: 50px; 
	border: solid thin rgba(255,255,255,1.00); 
	position: absolute;
	font-size: 8px;
}
   .container {
    margin-top: -50px;
}
    
	/*.elbordePleta, .cajaTitulo{
width: 310px; 
}*/
	
    .elbordePleta, .cajaTitulo{
width: 330px; 
    }
	
    .nueva{
   	width: 25px;
	height: 40px; 
    margin: 7px 4px 5px 4px;
}
    .header-logo{left:0px!important; }
	}

@media(min-width:425px) and (max-width:768px){
	.pepe{
		background-color:green;
	}
	.medida{
		width: 300px; 
		height: 169px;
	}
	.elalto{
		margin-top: -169px
	}
    .lacajita{
	width: 18px;
	height: 30px; 
	background-color: rgba(202,195,38,1.00); 
	display: inline-block;
	float:left; 
	margin: 5px 1px 5px 4px;
    font-size: 7px;
}
    .elMargen{
	margin-top: 35px;
}
    .cajatestigos{
	width: 50px; 
	height: 50px; 
	border: solid thin rgba(255,255,255,1.00); 
	position: absolute;
	font-size: 10px;
}
        .container {
    margin-top: -40px;
}
	
    /*.elbordePleta, .cajaTitulo{
width: 300px; 
}*/
	
.elbordePleta, .cajaTitulo{
width: 340px; 
}	
	
    .nueva{
   	width: 27px;
	height: 40px; 
    margin: 7px 2px 5px 2px;
}
    .header-logo{left:0px!important; }
	}
@media(min-width:768px) and (max-width:1024px){
	.pepe{
		background-color:blue;
	}
	.medida{
		width: 500px; 
		height: 281px;
	}
	.elalto{
		margin-top: -281px
	}
    .lacajita{
	width: 31px;
	height: 30px; 
	background-color: rgba(202,195,38,1.00); 
	display: inline-block;
	float:left; 
	margin: 5px 4px 5px 4px;
    font-size: 9px;
}
    .elMargen{
	margin-top: 160px;
}
    .cajatestigos{
	width: 50px; 
	height: 50px; 
	border: solid medium rgba(255,255,255,1.00); 
	position: absolute;
	font-size: 11px;
}
    .container {
    margin-top: -50px;
}
    .elbordePleta, .cajaTitulo{
width: 500px; 
    }
    .nueva{
   	width: 47px;
	height: 40px; 
    margin: 7px 6px 5px 5px;
}
    .header-logo{left:0px!important; }
	}
@media(min-width:1024px) and (max-width:1280px){
	.pepe{
		background-color:yellow;
	}
	.medida{
		width: 700px; 
		height: 393px;
	}
	.elalto{
		margin-top: -393px
	}
    
    .lacajita{
	width: 38px;
	height: 30px; 
	background-color: rgba(202,195,38,1.00); 
	display: inline-block;
	float:left; 
	margin: 5px 9px 5px 8px;
    font-size: 10px;
}
    .elMargen{
	margin-top: 260px;
}
    .cajatestigos{
	width: 50px; 
	height: 50px; 
	border: solid medium rgba(255,255,255,1.00); 
	position: absolute;
	font-size: 12px;
}
    .container {
    margin-top: -20px;
}
    .elbordePleta, .cajaTitulo{
width: 700px; 
    }
    .nueva{
   	width: 73px;
	height: 40px; 
    margin: 7px 5px 5px 5px;
}
    .header-logo{left:0px!important; }
	}
@media(min-width:1280px) and (max-width:1920px){
	.pepe{
		background-color:black;
	}
	.medida{
        width: 800px; 
		height: 450px;
/*		width: 1000px; 
		height: 562px;*/
	}
	.elalto{
		margin-top: -450px;
	}
    
    .lacajita{
	width: 50px;
	height: 30px; 
	background-color: rgba(202,195,38,1.00); 
	display: inline-block;
	float:left; 
	margin: 5px 7px 5px 6px;
    font-size: 13px;
}
    .elMargen{
	margin-top: 280px;
}
    .cajatestigos{
	width: 50px; 
	height: 50px; 
	border: solid medium rgba(255,255,255,1.00); 
	position: absolute;
	font-size: 12px;
}
    .container {
    margin-top: 0px;
}
    .elbordePleta, .cajaTitulo{
width: 800px; 
    }
    .nueva{
   	width: 85px;
	height: 40px; 
    margin: 7px 5px 5px 5px;
}
    .header-logo{left:0px!important; }
	}  
@media(min-width:1920px) and (max-width:2560px){
	.pepe{
		background-color:brown;
	}
	.medida{

width: 1000px; 
height: 562px;
	}
	.elalto{
		margin-top: -562px;
	}
    
    .lacajita{
	width: 65px;
	height: 30px; 
	background-color: rgba(202,195,38,1.00); 
	display: inline-block;
	float:left; 
	margin: 5px 7px 5px 7px;
    font-size: 13px;
}
    .elMargen{
	margin-top: 400px;
}
    .cajatestigos{
	width: 50px; 
	height: 50px; 
	border: solid medium rgba(255,255,255,1.00); 
	position: absolute;
	font-size: 12px;
}
    .container {
    margin-top: 0px;
}
 .elbordePleta, .cajaTitulo{
width: 1000px; 
    }
    .nueva{
   	width: 105px;
	height: 40px; 
    margin: 7px 7px 5px 9px;
}
    .header-logo{left:0px!important; }
	}  
/*nueva son las cajas de abajo de memorias*/