@charset 'utf-8';


/*=============================================
GRID CATEGORIAS
=============================================*/

.grid-categorias {display: grid;
	grid-template-columns: repeat(3, 2fr);
	grid-template-rows: repeat( 3, 200px ); /*repeat(2, 400px)*/;
	grid-gap: 1rem;
  	
}

.grid-categorias figure{
	position:relative;
	/*border-top:0px;
	border-bottom:0px;
	border-left:8px solid white;
	border-right:8px solid white;*/
	cursor:pointer;
	transition-delay: .5ms;
	transition:background-position 1.25s cubic-bezier(0.25,0.50,1,0.75);
	background-repeat: no-repeat;
}


.grid-categorias .photo1{
	/*height:400px;*/
	grid-column: 1/ span 1;
	grid-row:1/span 2;
	/*background:url(../img/suramerica.jpg);*/
	background-size:auto;
	background-position: 0% 0%;

}

.grid-categorias .photo2{
	/*height:300px;*/
	/*background:url(../img/africa.jpg);*/
	background-size:auto;
	background-position:top left;
}

.grid-categorias .photo3{
	/*height:300px;*/
	/*background:url(../img/centroamerica.jpg);*/
	background-size:cover;
	background-position:left;
}

.grid-categorias .photo4{
	/*height:300px;*/
	/*background:url(../img/europa.jpg);*/
	background-size:cover;
	background-position:left;
}

.grid-categorias .photo5{
	/*height:400px;*/
	/*background:url(../img/norteamerica.jpg);*/
	background-size:cover;
	background-position:top left;
	grid-column: 1/3;
}

.grid-categorias .photo6{
	/*height:200px;*/
	/*background:url(../img/asia.jpg);*/
	background-size:auto auto;
	background-position:top left;
    grid-column: 3/  4; 
    grid-row: 2/4;
}

.grid-categorias .photo1:hover, .grid-categorias .photo2:hover, .grid-categorias .photo3:hover,
.grid-categorias .photo4:hover, .grid-categorias .photo5:hover, .grid-categorias .photo6:hover{
  background-position: 100% 75%; 
}

.grid-categorias figure figcaption{
	position:absolute;
	left:0px;
	bottom:0px;
	width:100%;
	background:rgba(0,0,0,.7);
	color:white;
	font-weight: 600;
	font-size:12px;
	transition-property: background, color;
	transition-delay: .5ms;
	transition-duration: 1s;
	transition-timing-function: all;
	font-weight: 600;
}

.grid-categorias figure figcaption:hover{
	background:rgba(255,57,190,.7);
	color: rgba(0,0,0,1.00);
}




@media(max-width: 991px) and (min-width: 768px){


	.grid-categorias .photo1{
	  grid-column: 1/span 2;
	  grid-row: 1/2;	
	}

	.grid-categorias .photo4{
		grid-column:2/4;
		background-position: auto;
	}

	.grid-categorias .photo6{
		grid-column: 3/4;
		grid-row: 3/4;
	}

	.grid-categorias figure figcaption{	
		font-size:10px;
	}
 

}

@media(max-width: 767px) and (min-width: 576px){


    .grid-categorias{
    	grid-template-rows:repeat(4, 200px) ;
    }

	.grid-categorias .photo1{
		grid-column:1/4 ;
		grid-row:1/2;

	}

	.grid-categorias .photo2{
		grid-column:1/3; 
		grid-row:2/3;
	}

	.grid-categorias .photo3{
			background-size: cover;
	}

	.grid-categorias .photo4{
		
	}

	.grid-categorias .photo5{
		grid-column:1/4 ;
		grid-row:4/5 ;
	}

	.grid-categorias figure figcaption{	
		font-size:10px;
	}


}


@media(max-width: 575px){


	.grid-categorias{
        grid-template-columns: 1fr;
        grid-template-rows: repeat(6, 200px);
			}

	.grid-categorias .photo1{
		grid-column:1/span 1; 
		grid-row:1/2;
	}

	.grid-categorias .photo2{
		grid-column:1/2; 
		grid-row:2/3;
	}

	.grid-categorias .photo3{
		grid-column: 1/span 1;
		grid-row:3/4;
	}

	.grid-categorias .photo4{
		grid-column:1/2;
		grid-row:4/5;
	}

	.grid-categorias .photo5{
		grid-column: 1/2;
		grid-row:5/6; 
	}

	.grid-categorias .photo6{
		grid-column: 1/span 1;
        grid-row:6/7;
	}

	.grid figure figcaption{	
		font-size:12px;
	}

}