62 lines
		
	
	
	
		
			1.2 KiB
		
	
	
	
		
			SCSS
		
	
	
	
	
	
			
		
		
	
	
			62 lines
		
	
	
	
		
			1.2 KiB
		
	
	
	
		
			SCSS
		
	
	
	
	
	
| /* License: AGPL-3.0-or-later WITH WTO-AP-3.0-or-later
 | |
| Full license explanation at https://github.com/houdiniproject/houdini/blob/master/LICENSE */
 | |
| @import 'mixins';
 | |
| 
 | |
| body {
 | |
| 	padding: 0;
 | |
| }
 | |
| 
 | |
| .explore-header {
 | |
| 	background: #f6f6f6;
 | |
| 	width: 100%;
 | |
| 	position: relative;
 | |
| 	text-align: center;
 | |
| 
 | |
| 	&:before {
 | |
| 		content: '';
 | |
| 		position: absolute;
 | |
| 		bottom: 0;
 | |
| 		left: 0;
 | |
| 		width: 100%;
 | |
| 		background: $mosaic;
 | |
| 		height: 4px;
 | |
| 	}
 | |
| }
 | |
| 
 | |
| 
 | |
| .pastelBox--grey--dark:hover {
 | |
| 	@include box-shadow(2px 2px 5px 0 rgba(black, 0.1));
 | |
| 	@include transform(translateY(-1px));
 | |
| 	@include transition(all, 0.1s, ease);
 | |
| }
 | |
| .pastelBox--grey--dark img {
 | |
| 	background-color: white;
 | |
| }
 | |
| 
 | |
| // this strange looking CSS configures the masonry layout,
 | |
| // see http://salvattore.com/ for reference
 | |
| .masonry-column {
 | |
| 	float: left;
 | |
| }
 | |
| .size-1of3 {
 | |
| 	width: 33.33333%;
 | |
| }
 | |
| .size-1of2 {
 | |
| 	width: 50%;
 | |
| }
 | |
| .size-1of1 {
 | |
| 	width: 100%;
 | |
| }
 | |
| #masonry-grid[data-columns]::before {
 | |
| 	content: '3 .masonry-column.size-1of3';
 | |
| }
 | |
| @media screen and (max-width: 900px) {
 | |
| 	#masonry-grid[data-columns]::before {
 | |
| 		content: '2 .masonry-column.size-1of2';
 | |
| 	}
 | |
| }
 | |
| @media screen and (max-width: 500px) {
 | |
| 	#masonry-grid[data-columns]::before {
 | |
| 		content: '1 .masonry-column.size-1of1';
 | |
| 	}
 | |
| }
 | 
