@charset "UTF-8";
/*
* Responsive CSS based in Skeleton V1.2
* Copyright 2013, Moisés Busanya
* Edge Studio
*/

/* Table of Content
==================================================
	#Page Styles
	#Media Queries
	#Font-Face */

/* #Page Styles
================================================== */

/* List Instagram home */

.instagram_frame { height: 220px !important; text-align: center; }

#instagram_img {
	
	background-color: #fff !important;
    border-left: 5px solid #fff;
    border-right: 5px solid #fff;
    border-top: 5px solid #fff;
    border-bottom: 5px solid #fff;
    /*transition:border 0.5s ease;*/
    z-index: 1;
    width: 160px;
    padding: 5px;
	
}

#instagram_img:hover {
	
	background-color: #fff !important;
    border-left: 5px solid #fff;
    border-right: 5px solid #fff;
    border-top: 20px solid #fff;
    border-bottom: 20px solid #fff;
    /*transition:border 0.5s ease;*/
    z-index: 1;
    width: 160px;
    padding: 5px;
	
}

.instagram_margin { width: 185px; height: 175px !important; }

#instagram_date_top { 
	color: #6d6d6d;
    display: none;
    font-size: 11px;
    position: relative;
    top: -204px;
    transition:display 0.5s ease;
}

#instagram_img:hover ~ #instagram_date_top { display: block; transition:display 1s ease;  position: relative; top: -204px;  }

#instagram_data_bottom { 
	color: #6d6d6d;
    display: none;
    font-size: 11px;
    position: relative;
    top: -33px;
    transition:display 0.5s ease;
}

#instagram_img:hover ~ #instagram_data_bottom { display: block; transition:display 1s ease; position: relative; top: -33px; }

/* #Media Queries
================================================== */
	
	/* Big one Grid */	
	@media only screen and (min-width: 1440px) {
					
		.instagram_margin:nth-child(7n) { margin-right: 0px !important; }
						
	}
	
	/* Base 960 Grid */	
	@media only screen and (min-width: 960px) and (max-width: 1439px) {
	
		.instagram_margin:nth-child(4n) { margin-right: 0px !important; }
		.instagram_margin:nth-child(5n) { display: none !important; }
		.instagram_margin:nth-child(6n) { display: none !important; }
		.instagram_margin:nth-child(7n) { display: none !important; }
		
		#instagram_img { width: 199px; }
		#instagram_img:hover { width: 199px; }
		
		.instagram_margin {
		    height: 220px !important;
		    width: 220px;
		}
		
		.instagram_frame {
		    height: 260px !important;
		    text-align: center;
		}
		
		#instagram_date_top { 
			color: #6d6d6d;
		    display: none;
		    font-size: 11px;
		    position: relative;
		    top: -230px;
		    transition:display 0.5s ease;
		}
		
		#instagram_img:hover ~ #instagram_date_top { display: block; transition:display 1s ease;  position: relative; top: -245px;  }
		
		#instagram_data_bottom { 
			color: #6d6d6d;
		    display: none;
		    font-size: 11px;
		    position: relative;
		    top: -33px;
		    transition:display 0.5s ease;
		}
		
		#instagram_img:hover ~ #instagram_data_bottom { display: block; transition:display 1s ease; position: relative; top: -33px; }
	
	}

	/* Tablet Portrait size to standard 960 (devices and browsers) */
	@media only screen and (min-width: 768px) and (max-width: 959px) {
	
		.instagram_margin {
		    margin-right: 2px;
		}
						
	}

	/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
	@media only screen and (min-width: 480px) and (max-width: 767px) {
	
		#instagram_img { width: 179px; }
		#instagram_img:hover { width: 179px; }
		
		.instagram_margin {
		    height: 200px !important;
		    width: 200px;
		}
		
		.instagram_frame {
		    height: 240px !important;
		    text-align: center;
		}
		
		#instagram_date_top { 
			color: #6d6d6d;
		    display: none;
		    font-size: 11px;
		    position: relative;
		    top: -206px;
		    transition:display 0.5s ease;
		}
		
		#instagram_img:hover ~ #instagram_date_top { display: block; transition:display 1s ease;  position: relative; top: -223px;  }
		
		#instagram_data_bottom { 
			color: #6d6d6d;
		    display: none;
		    font-size: 11px;
		    position: relative;
		    top: -33px;
		    transition:display 0.5s ease;
		}
		
		#instagram_img:hover ~ #instagram_data_bottom { display: block; transition:display 1s ease; position: relative; top: -33px; }
												
	}

	/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
	@media only screen and (max-width: 479px) {
	
		#instagram_img { width: 280px; }
		#instagram_img:hover { width: 280px; }
		
		.instagram_margin {
		    height: 298px !important;
		    width: 298px;
		}
		
		.instagram_frame {
		    height: 340px !important;
		    text-align: center;
		}
		
		#instagram_date_top { 
			color: #6d6d6d;
		    display: none;
		    font-size: 11px;
		    position: relative;
		    top: -306px;
		    transition:display 0.5s ease;
		}
		
		#instagram_img:hover ~ #instagram_date_top { display: block; transition:display 1s ease;  position: relative; top: -326px;  }
		
		#instagram_data_bottom { 
			color: #6d6d6d;
		    display: none;
		    font-size: 11px;
		    position: relative;
		    top: -33px;
		    transition:display 0.5s ease;
		}
		
		#instagram_img:hover ~ #instagram_data_bottom { display: block; transition:display 1s ease; position: relative; top: -33px; }
					
	}