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/SBogers10/ste.komma.pro/resources/sass/6-Organisms/_organisms.mainfooter.scss
$o-mainfooter-emblem-gap: space(1);


.o-mainfooter {
	@include template(company, title1, title2, menu1, menu2, menu3, social, emblems);
	display: grid;
	grid-template-columns: 1fr 6fr 6fr 1fr;
	grid-template-rows: auto auto;
	grid-template-areas:
		". menu2 company ."
		". social company .";
	padding-top: space(10);
	padding-bottom: space(7);

	@include mq($o-footer-bp-large) {
		grid-template-columns: 1fr 2fr 2.75fr 2.25fr 2fr 3fr 1fr;
		grid-template-rows: repeat(3, auto);
		grid-template-areas:
			". company title1 title2 . emblems ."
			". company menu1 menu2 menu3 emblems .";
		padding-top: space(10);
		padding-bottom: space(7);
	}

	@include mq($bp-max) {
		grid-template-columns: 1fr ($site-column-size*2px) ($site-column-size*2.75px) ($site-column-size*2.25px) ($site-column-size*2px) ($site-column-size*3px) 1fr;
	}
}

// Hide all these divs on small screens
@include mq($max: $o-footer-bp-large) {
	.o-mainfooter__title1,
	.o-mainfooter__title2,
	.o-mainfooter__menu1,
	.o-mainfooter__menu3,
	.o-mainfooter__emblems {
		display: none !important;
	}
}


.o-mainfooter__company {
	display: flex;
	flex-direction: column;

	@include mq($max: $o-footer-bp-large) {
		justify-self: end;
		align-items: flex-end;
	}
}


.o-mainfooter__brand {
	margin-bottom: space(4);

	@include mq($o-footer-bp-large) {
		display: inline-flex;
		align-items: flex-start;
		width: 62.5%;
	}

	& svg { height: auto;	}
}


.o-mainfooter__language {
	margin-top: auto;
}


.o-mainfooter__heading {
	@include mq($max: $o-footer-bp-large) {
		display: none;
	}

	@include font-size(base);
	@include font-weight(extraBold);
	margin-bottom: space(2);

	> a {
		text-decoration: none;
		color: white;
		transition: color 0.2s;

		&:hover {
			color: rgba(palette(primary, 200), 0.75);
		}
	}
}


.o-mainfooter__list {
	list-style: none;
	margin: 0;
}


.o-mainfooter__item {}


.o-mainfooter__link {
	display: inline-block;
	position: relative;
	z-index: 0;
	color: palette(neutral, 0);
	padding: space(0.5) 0;
	text-decoration: none;
	cursor: pointer;
	transition: color 200ms;

	&:hover {
		color: rgba(palette(primary, 200), 0.75);
	}

	&:focus {
		outline-color: palette(action);
	}
}


.o-mainfooter__emblems {
	//align-self: start;
	//display: flex;
	//flex-wrap: wrap;
	//justify-content: flex-end;
	//margin: -$o-mainfooter-emblem-gap;
}

.o-mainfooter__emblem-placeholder {
	margin-left: auto;
	text-align: center;
}

.o-mainfooter__emblem {
	@include border-radius(xs);
	flex: none;
	display: flex;
	align-items: center;
	justify-content: center;
	//width: calc(50% - #{double($o-mainfooter-emblem-gap)});
	width: 120px;
	//max-width: 96px;
	margin: $o-mainfooter-emblem-gap 0 $o-mainfooter-emblem-gap auto;
	padding: space(1);
	//border: 1px solid rgba(palette(primary, 200), 0.5);

	&.nrto {
		img {
			width: 64px;
		}
	}
}


// Hide on larger views
.o-mainfooter__social {
	display: none;

	@include mq($max: $o-footer-bp-large) {
		display: flex;
		list-style: none;
		margin: space(3) 0 0;
	}
}