@import "variables";
.w-brandlist {
	h2, .h2 {
		margin-bottom: 16px;
		font-size: 24px;
		@media(max-width: 767px){
			margin-bottom: 4px;
		}
	}
	h3, .h3 {
		margin-bottom: 16px;
		font-size: 22px;
		line-height: 1.5;
		@media(max-width: 767px){
			margin-bottom: 4px;
		}
	}
	.wbl__list {
		margin: 0;
		padding: 0;
		list-style: none;
		font-size: 18px;
		& > li {
			margin-bottom: 12px;
		}
		a {
			border: 0;
			color: $color_dark;
			@include transition(none);
			&:hover {
				color: $blue;
			}
		}
		@media(max-width: 767px){
			/*font-size: 20px;
			font-weight: bold;*/
			& > li {
				border-bottom: 1px solid $color_gray_05;
				display: none;
				margin: 0;
				/*&:last-child {
					border-bottom: 0;
				}*/
				&.wbl__popular {
					display: block;
				}
			}
			a {
				display: block;
				padding-top: 12px;
				padding-bottom: 12px;
			}
		}
		.empty {
			opacity: .3;
			&:hover {
				opacity: 1;
			}
		}
	}
	.wbl__more {
		padding-top: 24px;
		//text-align: center;
		.icobox {
			&.size_24 {
				@media (max-width: 767px){
					font-size: 16px;
				}
			}
		}
		.btn {
			padding: 12px 24px 13px;
			.fa {
				margin-left: 8px;
			}
		}
		@media(min-width: 768px){
			display: none;
		}
	}
	.icobox {
		&.size_24 {
			padding-left: 36px;
			@media (max-width: 767px){
				padding-left: 52px;
				font-size: 20px;
				font-weight: bold;
				.ico {
					width: 36px;
					height: 36px;
					margin-top: -18px;
					font-size: 36px;
				}
			}
		}
	}
	//mods
	&.w-brandlist_mobileBig {
		@media(max-width: 767px){
			&:not(.w-brandlist_full){
				.wbl__list {
					font-size: 24px;
					font-weight: bold;
					a {
						padding-top: 16px;
						padding-bottom: 16px;
					}
					.icobox {
						padding-left: 64px;
						.ico {
							width: 48px;
							height: 48px;
							margin-top: -24px;
							font-size: 48px;
						}
					}
				}
			}
		}
	}
	&.w-brandlist_truck {}
	&.w-brandlist_full {
		.wbl__list {
			@media(max-width: 767px){
				& > li {
					display: block;
				}
			}
		}
		.wbl__more {
			display: none !important;
		}
		&.viewAsMobile {
			.wbl__list {
				& > li {
					display: block !important;
				}
			}
		}
	}

	&.viewAsMobile {
		h2, .h2 {
			margin-bottom: 4px;
		}
		h3, .h3 {
			margin-bottom: 4px;
		}
		.wbl__list {
			& > li {
				border-bottom: 1px solid $color_gray_05;
				display: none;
				margin: 0;
				&.wbl__popular {
					display: block;
				}
			}
			a {
				display: block;
				padding-top: 12px;
				padding-bottom: 12px;
			}
		}
		.wbl__more {
			display: block;
			.icobox {
				&.size_24 {
					font-size: 16px;
				}
			}
		}
		.icobox {
			&.size_24 {
				padding-left: 52px;
				font-size: 20px;
				font-weight: bold;
				.ico {
					width: 36px;
					height: 36px;
					margin-top: -18px;
					font-size: 36px;
				}
			}
		}
	}
	.w-brandlist__more {
		border: 0;
		position: relative;
		display: inline-block;
		max-width: 100%;
		padding-left: 36px;
		//font-size: 18px;
		//line-height: 20px;
		text-decoration: none;
		font-weight: bold;
		color: #0d61ab !important;
		fill: #0d61ab;
		@media(max-width: 767px){
			padding-left: 52px;
		}
		.icon {
			position: absolute;
			top: 2px;
			left: 0;
			display: block;
			width: 24px;
			height: 24px;
			@media(max-width: 767px){
				top: 50%;
				left: 6px;
				margin-top: -12px;
			}
		}
		&:hover {
			text-decoration: underline !important;
		}
	}
}