HEX
Server: Microsoft-IIS/8.5
System: Windows NT YDAWBH120 6.3 build 9600 (Windows Server 2012 R2 Standard Edition) AMD64
User: tentjecom_web (0)
PHP: 7.4.14
Disabled: NONE
Upload Files
File: D:/HostingSpaces/blijegasten/blijegasten.be/resources/sass/site/6-Organisms/_organisms.booth.scss
/*
 * The booth organism
 */


$o-booth-bp1:			900;
$o-booth-bp2:			1250;
$o-booth-gap: 			space(6);
$o-booth-item-border: 	2px solid palette(neutral, 100);


.o-booth {
	@include vspacing(
		'padding-top' 0.25,
		'margin-bottom' 1
	);
}


.o-booth__list {
	display: flex;
	flex-direction: column;
	align-items: center;
	max-width: 556px;
	margin: 0 auto;
	list-style: none;

	@include mq($o-booth-bp1) {
		flex-direction: row;
		flex-wrap: wrap;
		align-items: stretch;
		min-width: 100%;
		max-width: none;
	}
}


.o-booth__item {
	width: 100%;
	margin-bottom: $o-booth-gap;

	@include mq($max: $o-booth-bp1) {
		margin-bottom: space(3);

		& + & {
			padding-top: space(3);
			border-top: $o-booth-item-border;
		}
	}

	@include mq($o-booth-bp1) {
		display: flex;
		align-items: flex-end;
	}

	@include mq($o-booth-bp1, $o-booth-bp2){
		flex: 0 0 calc(#{column(1,2)});
		width: calc((100% / 2) - 1px); // -1px for rounding in IE

		// All items from the second last, but exclude every second child
		&:nth-last-child(n+2):not(:nth-child(2n)) {
			border-right: $o-booth-item-border;
		}
	}

	@include mq($o-booth-bp2){
		flex: 0 0 calc(#{column(1,3)});
		width: calc((100% / 3) - 1px); // -1px for rounding in IE

		// All items from the second last, but exclude every third child
		&:nth-last-child(n+2):not(:nth-child(3n)) {
			border-right: $o-booth-item-border;
		}
	}
}