.section-jumbotron {
	background: $color_dark;
	position: relative;
	@media(min-width: 992px){ min-height: 180px; }
	padding: 0px;
	font-size: 18px;
	line-height: 1.5;
	color: $color_white;
	@media (max-width: 991px){ font-size: 16px; }
	h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
		margin-bottom: 12px;
		font-weight: normal;
		color: inherit;
		line-height: 1;
		//text-shadow: 0 1px 1px #f4f6f9;
	}
	h1, .h1 {
		font-size: 26px;
		//line-height: 42px;
		//@media (max-width: 991px){ font-size: 36px; line-height: 1.3; }
		@media (max-width: 767px){ font-size: 24px; }

		&.fs-40 {
			@media (max-width: 767px){ font-size: 32px !important; }
		}
	}
	h2, .h2 {
		font-size: 24px;
		@media (max-width: 767px){ font-size: 20px; }
	}
	h3, .h3 {
		font-size: 20px;
		@media (max-width: 767px){ font-size: 18px; }
	}
	&.section-jumbotron_supergroup {
		@media(max-width: 575px){
			padding-bottom: 12px;
		}
		.section-jumbotron__image {
			position: relative;
			display: block;
			max-width: 80%;
			height: 90%;
			margin: 0 auto;
			z-index: 1;
			@media(max-width: 575px){
				height: auto;
			}
			@media(min-width: 576px){
				position: absolute; top: 5%; right: 8px;
			}
		}
		.section-jumbotron__body {
			@media(min-width: 768px) {
				padding-right: 40%;
			}
			@media(max-width: 575px){
				padding: 36px 12px 16px;
			}
			text-shadow: 1px 1px 2px rgba(0,0,0,0.25);
			h1 {
				font-size: 40px;
			}
		}
	}
	&.section-jumbotron_shdtxt {
		text-shadow: 1px 1px 2px rgba(0,0,0,0.25);
	}
	.section-jumbotron__bg {
		background-repeat: no-repeat;
		background-position: 50% 50%;
		background-size: cover;
		position: absolute; top: 0px; left: 0px;
		z-index: 1;
		display: block; width: 100%; height: 100%;
	}
	.section-jumbotron__body {
		position: relative;
		z-index: 2;
		padding: 40px 48px 40px;
		@media (max-width: 991px){ padding: 35px 24px 45px; }
		@media (max-width: 767px){ padding: 35px 12px 45px; }
		&.sm {
			padding: 24px;
			@media (max-width: 991px){ padding: 20px; }
			@media (max-width: 767px){ padding: 16px; }
		}
	}
	.section-jumbotron__right {
		position: absolute; top: 5%; right: 8px;
		z-index: 1;
		height: 90%;
		display: block;
	}

	.jumbotron-highlight {
		display: inline-block;
		padding: 2px 16px 4px;
		@media (max-width: 767px){
			padding: 2px 8px 4px;
		}
		&.h1 {
			margin: 0;
			font-size: 22px;
			font-weight: bold;
			line-height: 1.3;
			@media (max-width: 767px){
				font-size: 14px;
			}
		}
		&.warning {
			background: $yellow;
			color: $color_black;
		}
		&.danger {
			background: #992626;
			color: $white;
		}
	}

	&_main {
		line-height: 1.25;
		color: $color_white;
		@media (max-width: 991px){ font-size: 16px; }
		@media (max-width: 767px){ font-size: 14px; }
		h1, .h1 {
			//margin-bottom: 4px;
			font-size: 42px;
			line-height: 42px;
			text-shadow: 0 1px 1px #f4f6f9;
		}
	}
	&_truck {
		text-shadow: 0px 0px 5px #333, 1px 1px 0px #333, 2px 2px 0px #333;
	}

	&.section-jumbotron-a {
		@media (max-width: 449px) { min-height: 224px; }
		@media (max-width: 360px){ min-height: 176px; }
		h1 {
			line-height: 1.3;
			@extend .text-shadow-dark;
			font-size: 24px;
			@media (max-width: 340px){
				margin-top: -16px;
				font-size: 18px;
			}
		}
		.h1 {
			margin-top: -10px;
			font-size: 40px;
			font-weight: bold;
			line-height: 1;
			@media (max-width: 991px){
				margin-top: 0;
				font-size: 32px;
			}
			@media (max-width: 767px){
				font-size: 24px;
				line-height: 1.25;
			}
		}
	}

	&.section-jumbotron-estberg {
		background: #F6F6F6;
		position: relative;
		padding: 24px;
		font-size: 14px;
		line-height: 1.5;
		color: $color_dark;
		&:before {
			content: '';
			background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(0,0,0,1) 100%);
			background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(0,0,0,1) 100%);
			background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(0,0,0,1) 100%);
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#000000',GradientType=0 );
			position: absolute; bottom: 0; left: 0; right: 0;
			display: block; height: 4px;
			opacity: 0.025;
		}
		.sje-preview {
			border: 1px solid $color_gray_10;
			position: relative;
			display: block;
			max-width: 400px;
			span {
				position: relative;
				overflow: hidden;
				display: block;
			}
			img {
				display: block;
				width: 100%;
				@include transition();
			}
			&:hover {
				img {
					@include transform(scale(1.15));
				}
			}
		}
		h1, .h1 {
			margin-bottom: 16px;
			font-size: 34px;
			font-weight: bold;
			@media (max-width: 991px){ font-size: 28px; }
			@media (max-width: 767px){ font-size: 24px; }
		}
		a {
			border-bottom-color: transparent;
			&:hover {
				border-bottom-color: $blue;
			}
		}
		.sje-list {
			margin: 0;
			padding: 0;
			list-style: none;
			dt { margin: 0; padding: 0; }
			dd, li {
				margin: 0; padding: 0;
				&:not(:first-child){
					margin-top: 4px;
				}
				&.sje-list-dott {
					position: relative;
					padding-left: 16px;
					&:before {
						content: '';
						background: $color_dark;
						position: absolute; top: 0.5em; left: 0;
						display: block; width: 8px; height: 8px;
						@include border-radius(50%);
					}
				}
			}
		}
		.sje-callToAction {
			background: $white;
			border-top: 1px solid $color_gray_10;
			position: fixed; left: 0; right: 0; bottom: 0;
			z-index: 999;
			padding: 12px;
			text-align: center;
			display: none;
			@media(max-width: 767px){
				display: block;
			}
			.btn {
				padding-left: 24px;
				padding-right: 24px;
			}
		}
	}

	.covid-infoLink {
		position: absolute; bottom: 0; right: 16px;
		z-index: 5;
	}

	&.section-jumbotron_sweden {
		min-height: 180px;
		color: #333;
		@media(max-width: 767px){
			min-height: 160px;
		}
		.section-jumbotron__bg {
			background-position: 0 0;
		}
		.section-jumbotron__body {
			padding: 16px 16px 16px 200px;
			font-size: 38px;
			@media(max-width: 767px){
				padding: 24px 16px 24px 110px;
				font-size: 20px;
			}
			@media(max-width: 359px){
				padding: 24px 16px 24px 110px;
				font-size: 18px;
			}
			h1, .h1 {
				font-size: inherit;
				font-weight: 700;
			}
			h2, .h2 {
				font-size: inherit;
				font-weight: normal;
			}
		}
	}

	/** TODO */
	&.section-jumbotron_countries {
		background: #F4F4F4;
		min-height: 180px;
		color: #333;
		font-size: 16px;
		@media(max-width: 767px){
			min-height: 90px;
			font-size: 12px;
		}
		.section-jumbotron__bg {
			background-position: 0 0;
			background-size: auto 100%;
		}
		.section-jumbotron__body {
			padding: 16px 16px 48px 240px;
			@media(max-width: 767px){
				padding: 8px 8px 28px 120px;
			}
			h1, .h1 {
				margin-bottom: 12px;
				font-size: 36px;
				font-weight: 700;
				@media(max-width: 767px){
					margin-bottom: 4px;
					font-size: 18px;
				}
			}
			h2, .h2 {
				font-size: inherit;
				font-weight: normal;
			}
			.label {
				padding: 3px 6px 4px;
				@include border-radius(0);
			}
		}
	}
}

.jumbotron-australia {
	background: $white;
	position: relative;
	overflow: hidden;
	@media(max-width: 575px){
		background: #f5f7fa;
	}
	.jumbotron-australia__mobile {
		position: absolute; right: 0; bottom: 0; left: 0;
		display: none;
		width: 100%;
		@media(max-width: 575px){
			display: block;
		}
	}
	.jumbotron-australia__left {
		display: block;
		height: 190px;
		@media(max-width: 575px){
			display: none;
		}
	}
	.jumbotron-australia__right {
		position: absolute; top: 0; right: 0;
		display: block;
		height: 190px;
		@media(max-width: 575px){
			display: none;
		}
	}
	.jumbotron-australia__body {
		position: absolute; bottom: 0; left: 50%; right: 17%;
		z-index: 5;
		margin: 0;
		padding: 0;
		list-style: none;
		font-size: 22px;
		font-weight: bold;
		text-transform: uppercase;
		text-align: center;
		@media(max-width: 991px){
			left: 50%;
			right: 10%;
		}
		@media(max-width: 575px){
			position: relative;
			left: auto;
			right: auto;
			bottom: auto;
			padding: 16px 12px 100px;
			font-size: 18px;
		}
		dt {
			margin-bottom: 8px;
			font-size: 48px;
			@media(max-width: 767px){
				font-size: 36px;
			}
		}
		dd {
			strong {
				font-size: 32px;
			}
		}
		.hl {
			background: $yellow;
			position: relative;
			display: inline-block;
			white-space: nowrap;
			span {
				position: relative;
				z-index: 5;
				display: inline-block;
				padding: 1px 4px;
			}
			&:before {
				content: '';
				background: inherit;
				position: absolute; top: 0; bottom: 0; left: 0;
				width: 32px;
				-webref-transform-origin: 0 0;
				-moz-transform-origin: 0 0;
				-ms-transform-origin: 0 0;
				-o-transform-origin: 0 0;
				transform-origin: 0 0;
				@include transform(skewX(-24deg));
			}
			&:after {
				content: '';
				background: inherit;
				position: absolute; top: 0; bottom: 0; right: 0;
				width: 32px;
				-webref-transform-origin: 100% 100%;
				-moz-transform-origin: 100% 100%;
				-ms-transform-origin: 100% 100%;
				-o-transform-origin: 100% 100%;
				transform-origin: 100% 100%;
				@include transform(skewX(-24deg));
			}
			&.white {
				background: $white;
				@media(max-width: 575px){
					//background: #f5f7fa;
					background: transparent;
				}
			}
		}
	}
}

.jumbotron-auto-parts {
	position: relative;
	overflow: hidden;
	display: flex;
	background-color: #F4F4F4;
	background-position: 0 0;
	background-repeat: no-repeat;
	background-size: auto 100%;
	color: #333;
	font-size: 16px;
	@media(max-width: 767px){
		font-size: 12px;
	}
	.jumbotron-auto-parts__image {
		min-width: 240px;
		@media(max-width: 767px){
			min-width: 120px;
		}
		img {
			display: block;
			min-height: 180px;
			@media(max-width: 767px){
				min-height: 90px;
			}
		}
	}
	.jumbotron-auto-parts__body {
		position: relative;
		flex-grow: 1;
		padding: 16px 16px 56px 0;
		font-weight: 600;
		@media(max-width: 767px){
			background: #f4f4f4;
			padding: 8px 8px 28px 0;
			&:before {
				content: '';
				background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(244,244,244,1) 100%);
				background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(244,244,244,1) 100%);
				background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(244,244,244,1) 100%);
				filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#f4f4f4',GradientType=1 );
				position: absolute; top: 0; right: 100%; bottom: 0;
				width: 40px;
			}
		}
		h1, .h1 {
			margin-bottom: 8px;
			font-size: 36px;
			font-weight: 700;
			@media(max-width: 1199px){
				font-size: 32px;
			}
			@media(max-width: 991px){
				margin-bottom: 6px;
				font-size: 28px;
			}
			@media(max-width: 767px){
				margin-bottom: 4px;
				font-size: 18px;
			}
		}
		h2, .h2 {
			margin-bottom: 8px;
			font-size: 32px;
			font-weight: 700;
			@media(max-width: 1199px){
				font-size: 28px;
			}
			@media(max-width: 991px){
				margin-bottom: 6px;
				font-size: 24px;
			}
			@media(max-width: 767px){
				margin-bottom: 4px;
				font-size: 18px;
			}
		}
		.label {
			padding: 3px 6px 4px;
			@include border-radius(0);
		}
		.jumbotron-auto-parts__parts {
			position: absolute; bottom: 0; left: -45px;
			display: block;
			max-height: 80px;
			@media(max-width: 1199px){
				max-height: 60px;
			}
			@media(max-width: 767px){
				max-height: 28px;
			}
		}
	}
}