@import "backgrounds.css";

.hub__slider-block__block {
	display: flex;
	background-color: #fff;
	/* padding: 20px 22px; */
	height: 100%;
	position: relative;
	border-radius: 12px;
	/* border: solid 2px #d6dbe0; */
	background-repeat: no-repeat;
	/* background-size: 90%, 100%; */
	background-position: 90% 50%, center; 
	flex-direction: column;
	min-height: 310px;
} 

.hub__slider-block__block a {
	display: block;
	height: 100%;
	position: relative;
	width: 100%;
	text-shadow: 0px 0px 3px rgb(67 102 219);
}

.hub__block-name span {
	background-color: transparent;
    display: inline-block;
    font-size: 26px;
    font-weight: 600;
    text-decoration: none;
    padding: 15px;
    width: 80%;
    color: #fff;
	margin-bottom: 20px;
}

.hub__block-price-from {
	background: linear-gradient(47deg, #fcb410 -15%, #ff4d77 100%);
    color: #fff;
    font-size: 13.8px;
    padding: 7px 20px;
    position: absolute;
    bottom: 40px;
}

.pos-left.hub__block-price-from {
    border-radius: 0 8px 8px 0;
}

.pos-right.hub__block-price-from {
	border-radius: 8px 0 0 8px;
}

/* .pos-right.hub__block-price-from::before {
    content: '';
    position: absolute;
    left: -39px;
    bottom: 0px;
    border: 19px solid transparent;
    border-right: 20px solid #0099ff;
} */

/* .pos-left.hub__block-price-from::after{
    content: '';
    position: absolute;
    right: -39px;
    bottom: 0px;
    border: 19px solid transparent;
    border-left: 20px solid #0099ff;
} */

.hub__total-products {
	padding: 10px;
    position: absolute;
    bottom: 0px;
    color: #fff;
    font-size: 15px;
}

.pos-left {
	left: 0px;
}

.pos-right {
	right: 0px;
}

.rotated-left {
	display: flex;
	transform: rotate(270deg);
	margin: auto;
	margin-top: 164px;
}

.rotated-right {
	display: flex;
	transform: rotate(90deg);
	margin: auto;
	margin-top: 164px;
}

.rotated-left:hover,
.rotated-right:hover {
	opacity: .8;
}

.manufacturers-name {
	color: #8f8383 ;
	font-size: 15px;
    font-weight: 400;
    text-align: center;
    width: 100%;
    display: inline-block;
    padding: 5px 0;
}

.manufacturers-name:hover {
	color: #333;
}

.hub__slider-block__manufacturer {
	/* background: linear-gradient(0deg, #f28039 0%, #f3b055 80%); */
	background-color: #edf1f4;
}

.manufacturer-title-left {
	position: absolute;
	background-color: #0099ff;
	color: #fff;
	padding: 10px 15px;
	border-radius: 4px;
	margin-top: 207px;
	width: 210px;
	transform: rotate(270deg);
	text-align: center;
	box-shadow: 0px 7px 9px -2px rgb(34 60 80 / 54%);
	text-shadow: -2px 0px 3px rgb(0 0 137 / 30%);
	left: -104px;
}

.manufacturer-title-right {
	position: absolute;
	background-color: #0099ff;
	color: #fff;
	padding: 10px 15px;
	border-radius: 4px;
	margin-top: 207px;
	width: 210px;
	transform: rotate(90deg);
	text-align: center;
	box-shadow: 0px 7px 9px -2px rgb(34 60 80 / 54%);
	text-shadow: -2px 0px 3px rgb(0 0 137 / 30%);
	right: -104px;
}


@media (max-width: 575px) {
	.rotated-left,
	.rotated-right {
		transform: rotate(0);
		padding: 25px;
		margin-top: 0;
		width: 300px;
	}

	.manufacturer-title-right,
	.manufacturer-title-left {
		margin-top: 0;
		transform: rotate(0deg);
		left: 10px;
    	top: -10px;
		right: 0;
	}
}
@media (max-width: 767px) {
	

	/* .hub__slider-block__manufacturer {
		height: auto;
	} */

	/* .hub__block-price-from {
		bottom: 0;
	} */

	.right.hub__block-price-from::before,
	.left.hub__block-price-from::after {
		content: none;
	}

	.hub__block-price-from {
		display: none;
	}
}

@media (max-width: 924px) {
	.hub-block .thumb img,
	.hub-block .thumb-c img {
    margin: auto 0 auto auto !important;
	}
}

.slick-track {
	display: flex;
	width: auto !important;
}

.slick-slide {
	height: auto;
}

.slick-slide:hover .hub-thumb .totals{
	opacity: 1;
	transition: opacity .8s;
}

.slick-slide:hover .hub-manufacturer img {
	max-height: 33px;
	transition: max-height .8s;
}

.hub-manufacturer {
	padding: 50px 10px !important;
    border-radius: 4px !important;
    border: none !important;
    display: flex !important;
    margin-bottom: 20px !important;
	margin-top: 28px !important;
    color: #001a1a !important;
}

.hub-thumb {
	width: 100%;
    margin: auto 0;
    height: 70px;
    text-align: center;
}

.hub-manufacturer img {
	vertical-align: middle;
    max-height: 60px;
    display: inline-block;
	margin: auto;
	transition: max-height .8s;
}

.hub-thumb .totals {
	margin: 20px 25px 20px 25px;
    padding-top: 20px;
    border-top: 1px solid #d6dbe0;
    font-size: 16px;
    font-weight: 600;
	opacity: 0;
	transition: opacity .8s;
}

.hub__slider-block__block.flex-a.hub__slider-block__manufacturer .hub__block-price-from {
    display: none;
}