/*
	Banner
*/

.banner--home {
	position: relative;
	margin-bottom: 30px;
}

.banner--home .img-center {
	position: absolute;
	left: 0;
    right: 0;
    margin: auto;
	top: 28%;
    max-width: 35%;
}

.banner--home p {
	position: absolute;
    bottom: 24%;
    width: 96%;
    background: var(--color-bg-light);
    padding: 10px;
    left: 0;
    right: 0;
    margin: auto;
    text-align: center;
}

.img-grid {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	flex-wrap: wrap;
}

.img-grid img {
 	height: 100%;
	width: 100%;
}

.img-grid .img-grid__left,
.img-grid .img-grid__right {
	max-width: 100%;
}

.img-grid .img-grid__left {
	width: calc(40% - 4px);
}

.img-grid .img-grid__right {
	width: calc(60% - 6px);
}

.img-grid .img-grid__bottom {
	width: 100%;
}


@media (max-width: 1000px) {
	.img-grid .img-grid__bottom {
		height: 60vh;
	}

	.banner--home .img-center {
		top: 18%;
		max-width: 60%;
	}

	.img-grid .img-grid__bottom img {
		object-fit: cover;
	}
}


/*
	Jam
*/
.jams {
	background: var(--color-bg-light);
	padding: 10px;
	margin-bottom: 30px;
}

.jam {
	margin-bottom: 10px;
	align-items: center;
}

.jam .jam__text {
	margin-bottom: 0;
}

.jam:last-child {
	margin-bottom: 0;
}

.jam img {
	margin-bottom: 5px;
	max-width: 50vw;
}

@media (max-width: 756px) {
	.jam {
		margin-bottom: 30px;
		text-align:center;
	}
}


#susenky .cookies-logo {
	max-width: 40%;
	z-index: 1;
	position: relative;
}

.grid-img-bottom {
	margin-top: -40px;
	position: relative;
	margin-bottom: 30px;
}

.grid-img-bottom .badge {
	position: absolute;
    bottom: -25%;
    right: 6%;
    width: 25%;
	z-index: 1;
}

.grid-img-bottom img {
	height: 100%;
	max-height: 70vh;
	width: 100%;
	object-fit: cover;
}

@media (max-width: 756px) {
	.grid-img-bottom > div {
		padding: 0 !important;
	}
	.grid-img-bottom .badge {
		bottom: -4%;
		right: 0%;
	}

}

@media (max-width: 500px) {
	#susenky .cookies-logo {
		max-width: 66%;
	}
}

.textbox {
	text-align: center;
	background-color: var(--color-bg-light);
	padding: 10px;
	margin-bottom: 50px;
}

.electrobox {
	background-color: var(--color-bg-light);
	border: 1px solid var(--color-primary);
	padding: 10px;
	margin-bottom: 50px;
}

.electrobox .foxmade {
	max-width: 60%;
    margin-bottom: 15px;
}

.electrobox h2 {
	font-size: 35px;
}

.electrobox * {
	font-weight: normal;
}

input, select, .v-select, textarea {
	background: var(--color-bg);
	border-color: var(--color-primary);
	border-radius: 0;
	height: 60px;
}