/* ----------- By Popy ------------ */
.portfolioFilter {
	text-align: center;
	margin-bottom: 15px;
    margin-top: 20px;
/* -------------------------------- */
}
.portfolioFilter a { 
    margin-right: 15px; 				/* Separación horizontal entre TAGs. Defecto: 15px; */
	color:#383634;						/* Casi negro. Color del texto de los TAGs inactivos. Defecto: #383634 */
	background-color: #f3f3f3;			/* Casi blanco. Color del fondo de los TAGS inactivos. Defecto: #f3f3f3 */
	text-decoration:none;				/* Defecto: none; */
	padding: 10px 15px;					/* Altura (padding top y bottom) y ancho (padding left y right) de cada TAG. Defecto: padding: 10px 20px; */
	border-radius: 2px;					/* Defecto: border-radius: 2px; */
	font-size: 14px;					/* Tamaño del texto en los TAGS. Defecto: font-size: 14px; */
	text-transform: uppercase;

}
.portfolioFilter a:hover {
	color: #fff;						/* Color del texto de los TAGS inactivos al pasar sobre ellos el cursor. Defecto: #fff */
	background-color: #cedc35;			/* Verde. Color del TAG inactivo cuando pasa sobre él el cursor. Defecto: #4abe63 */
}
.portfolioFilter a.current {
	color: #fff;						/* Color del texto del TAG activo. Defecto: #fff */
	background-color: #cedc35;			/* Verde light-green= b1cb35. Color del fondo del TAG activo. Defecto: #4abe63; (verde) */
}

.portfolioContainer {
	width: 100%;						/* Afecta al ancho disponible del contenedor para mostrar las miniaturas del portfolio. Defecto: 100%; */
	font-size: 10px;					/* Defecto: 10px; */
	margin-left: 108px;					/* By Popy. Para centrar las miniaturas en la página */

}

.isotope-item {
    z-index: 2;
	width: 220px;			/* Importante: afecta al nº de miniaturas que se ven en cada fila (según la resolución). Defecto: 370px; */
							/* Debe ser igual al valor del ancho de la caja que muestra la miniatura, o sino, el ratón responderá a los clicks fuera de la caja */
	height: 200px;			/* Importante: afecta al nº de miniaturas que se ven en cada columna o separación entre items en vertical (según la resolución).  Defecto: 300px; */
	margin-bottom: 20px;	/* Separación entre miniaturas en cada columna. Defecto: 20px; */
	margin-right: 20px;		/* Separación entre miniaturas en cada fila. Defecto: 20px; */
}
.isotope-hidden.isotope-item {
    pointer-events: none;
    z-index: 1;
}
.isotope,
.isotope .isotope-item {
  /* change duration value to whatever you like */

    -webkit-transition-duration: 0.8s;
    -moz-transition-duration: 0.8s;
    transition-duration: 0.8s;
}
.isotope {
    -webkit-transition-property: height, width;
    -moz-transition-property: height, width;
    transition-property: height, width;
}
.isotope .isotope-item {
    -webkit-transition-property: -webkit-transform, opacity;
    -moz-transition-property: -moz-transform, opacity;
    transition-property: transform, opacity;
}



@media only screen and (min-width: 1000px) and (max-width: 1169px){

/* ------------  By Popy ------------------------- */
.portfolioContainer {
	width: 100%;						/* Afecta al ancho disponible del contenedor para mostrar las miniaturas del portfolio. Defecto: 100%; */
	font-size: 10px;					/* Defecto: 10px; */
	margin-left: 60px;					/* By Popy. Para centrar las miniaturas en la página */
}
/* ------------------------------------------------ */

.isotope-item {
    z-index: 2;
	width: 200px;			/* Defecto: 320px; */
	height: 200px;			/* Defecto: 300px; */		
	margin-bottom: 10px;	/* Defecto: 8px; */
	margin-right: 20px;		/* Defecto: 13px; */
}


}


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


/* ------------  By Popy ------------------------- */
.portfolioContainer {
	width: 100%;						/* Afecta al ancho disponible del contenedor para mostrar las miniaturas del portfolio. Defecto: 100%; */
	font-size: 10px;					/* Defecto: 10px; */
	margin-left: 45px;					/* By Popy. Para centrar las miniaturas en la página */
}
/* ----------------------------------------------- */	

.isotope-item {
    z-index: 2;
	width: 200px;			/* Defecto: 239px; */
	height: 200px;			/* Defecto: 251px; */		
	margin-bottom: 10px;		/* Defecto: 9px; */
	margin-right: 25px;		/* Defecto: 9px; */
}

}


@media only screen and (min-width: 480px) and (max-width: 767px){

.portfolioContainer {
	width: 90%;				/* Defecto: 90%; */
	margin-left: 25%;		/* Defecto: 5% */;
}

}

	


@media only screen and (max-width: 479px){
	
/* ------------  By Popy ------------------------- */	
.portfolioContainer {
	width: 90%;				/* Defecto: 90%; */
	margin-left: 14%;		/* Defecto: 5% */;
}
/* ----------------------------------------------- */	

.portfolioFilter a { 
	padding: 10px 10px;
	font-size: 12px;
	margin-right: 7px;

		
}	
	
}