.qram-cartlist-buttons{
	padding: 3px 0;
	display: flex;
	}

.qram-cartlist-buttons div{
	min-height: 10px;
	flex-grow: 1;
	}

.qram-cartlist-button-change,
.qram-cartlist-button-remove{
	display: block;
	font-size: 1.2rem;
	margin: 3px auto auto;
	padding: 4px 7px 3px;
	line-height: 100%;
	background: #faf7f1;
	border: 1px solid #d2bd86;
	border-radius: 2px;
	font-weight: 600;
	color: #906c25;
	}

.qram-cartlist-button-change{
	margin-right: 5px;
	}

.qram-cartlist-button-change:hover,
.qram-cartlist-button-remove:hover{
	text-decoration: underline;
	}

.qram-cartlist-selectitem{
	margin: 5px auto;
	font-size: 1.25rem;
	border: 1px solid #b88f42;
	background: #faf7f1;
	color: black;
	background: linear-gradient(to bottom right, #faf7f2 60%, #d1bc86);
	border-radius: 3px;
	}

.qram-cartlist-selectitem strong{
	display: block;
	margin: auto;
	background: #b89041;
	padding: 6px 0 5px;
	text-align: center;
	line-height: 100%;
	color: #faf7f1;
	font-weight: 600;
	}

.qram-cartlist-selectitem ul{
	list-style-type: square;
	margin: auto 10px;
	padding: 10px 10px;
	}

.qram-cartlist-selectitem li{
	padding: 3px 0;
	}

.qram-cartlist-selectitem span{
	display: block;
	}

.qram-cartlist-selectitem span:hover{
	text-decoration: underline;
	}

.qram-cartlist-selectitem-actual span,
.qram-cartlist-selectitem-actual span:hover{
	text-decoration: line-through;
	}


	/* 1) Hlavička - zalamování kontaktů */
@media (min-width: 990px)
{
	.top-navigation-bar .container > div:first-child,
	.top-navigation-bar .container > div:last-child{
  		min-width: 325px;
		}
}

/*
2) 	Podtržené všechny odkazy
	2.1) v patičce
	2.2) lišta výhod
	2.3) názvy produktů včetně těch obrázkových) hover efekty = při najetí myši se u textových podtrhne, u produktů se zvětší text/obrázek apod.
	 stín jsem zkoušel, ale ve vašem layoutu s "rámečky" vypadal divně, nehodil se tam
	2.4) mobilní menu
	2.5) social buttons v detailu
	2.6) další odkazy
*/
/* 2.1 */
.custom-footer a:hover{
	text-decoration: underline;
	}

/* 2.2 */
.benefitBanner a:hover{
	text-decoration: underline;
	}

/* 2.3. název a obrázek - stín jsem zkoušel, ale ve vašem layoutu s "rámečky" vypadal divně */
.product a.name:hover{
	text-decoration: underline;
	}

.product a.image img{
	transition: transform 0.2s ease-in-out;
	}

.product a.image img:hover{
	transform: scale(1.035);
	}

.product a.image:hover + div.p-in a.name{
	text-decoration: underline;
	}

/* 2.4. */
#navigation	.navigation-in.menu a:hover{
	text-decoration: underline;
	}

/* 2.5. */
.social-buttons-wrapper a:hover{
	text-decoration: underline;
	}

/* 2.6 */
.top-navigation-contacts a:hover,
.top-navigation-bar-menu a:hover,
.top-navigation-tools a:hover,
.top-navigation-tools .dropdown button:hover{
	text-decoration: underline;
	}

.contact-box a:hover{
	text-decoration: underline;
	}



/* 3. Whatsapp ikonka */
#return-to-top{
	bottom: 100px;
	}


/* 4. Detail produktu - související za detailní popis */

.p-detail{
	display: flex;
	flex-direction: column;
	}

.p-detail > .p-detail-inner{order: -5;}
.p-detail > .p-detail-tabs-wrapper{order: -4;}
.p-detail > h2.products-related-header{order: -3;}
.p-detail > .products-related{order: -2;}


/* 5. Seznam produktů - Skladovost u produktu */
.availability span[style="color:#590222"],
span.availability-label[style="color: #590222"]{
	color: #008080 !important;
	}

.availability span{
	font-size: 1.7rem;
	font-weight: 500;
	}

span.availability-label{
	font-size: 1.9rem;
	font-weight: 500;
	}

/* 6. Seznam produktů  */

/* 7. Seznam produktů - tlačítko koupit */
.products .prices{
	flex-basis: 45%;
	}

.products .p-tools{
	flex-basis: 55%;
	}

.products .p-tools a.btn-primary{
	white-space: nowrap;
	}

.products .p-tools a.btn-primary span{
	display: none;
	}

.products .p-tools a.btn-primary i{
	display: inline-block;
	font-style: normal;
	}

#products-6 .product .p-tools,
#products-15 .product .p-tools,
#products-20 .product .p-tools{
	flex-basis: 100%;
	}

#products-6 .product .p-tools a,
#products-15 .product .p-tools a,
#products-20 .product .p-tools a{
	min-width: 140px;
	}

@media (min-width: 480px) and (max-width: 800px)
{
	.products .p-tools a.btn-primary{
		padding-left: 8px;
		padding-right: 8px;
		}
}

@media (min-width: 480px) and (max-width: 610px), (max-width: 350px)
{
	#products .p-tools a.btn-primary span{
		display: inline-block;
		}

	#products .p-tools a.btn-primary i{
		display: none;
		}
}

/* 8. Grafika newsletteru z homepage na další stránky */


/* 9. Košík - přeskupení checkboxů */

/* 10. Změna fontu H1+2 */
.p-detail h1,
h2.products-related-header{
	font-family: Quicksand;
	}


/* 12+15. odsazení hlavičky od shora a ikonka košíku*/
#header .container{
	margin-top: 0;
	}

@media only screen and (max-width: 768px)
{
  	#header .cart-count {
		top: -45px;
		right: 70px;
		z-index: 999;
		}

	#header .header-top .btn.cart-count::before{
		margin-right: 0;
		}
}

@media only screen and (min-width: 768px)
{
	body.id-1 .top-navigation-bar{
		position: static;
		}
}

/* 16. social ikonky v detailu položky */
.link-icon.print,
.link-icon.share,
.link-icon.chat{
	display: none;
	}

/* 17. pryč checkbox pro podmínky v košíku >> přes JS*/
.qram-consents label.whole-width{
	padding-left: 0;
	font-size: 1.35rem;
	}

.qram-consents label.whole-width::before,
.qram-consents label.whole-width::after,
.qram-consents span.required-asterisk::after{
	display: none;
	}

/*

	18. Popis v seznamu produktů (cca hodina)
	19. srdíčko pro oblíbené v seznamu produktů a v detailu (cca hodina)
	20. přemístění "Hlídat" v detailu - zatím nevím kam. Odstranění odkazu "Detailní informace"?


*/

/* 19. favorites */

/* 20. hlidaci pes */
a.link-icon:hover{
	text-decoration: underline;
	}

.link-icon.watchdog:before{
	display: inline-block;
	margin: auto;
	line-height: 100%;
	font-size: 15px;
	margin-right: 5px;
	position: relative;
	top: -3px;
	}

.link-icon.watchdog{
	text-transform: none;
	margin-bottom: 0;
	}

p[data-testid="productCardDescr"]{
	display: none;
	}


/* 21.ikonky v detailu */
.type-detail .detail-flag.w1{
	flex-wrap: nowrap;
	padding: 15px 10px;
	}

.type-detail .detail-flag.w1 span{
	min-width: 0;
	min-height: 0;
	clear: none;
	width: 15%;
	max-width: 80px;
	max-height: 80px;
	aspect-ratio: 1/1;
	}

.type-detail .detail-flag.w1 span.flag{
	border-radius: unset !important;
	background-size: 100% 100% !important;
	}


.qram-favorite-detail,
.qram-favorite-list{
	height: 0;
	width: 100%;
	display: none;
	justify-content: flex-end;
	}

@media (min-width: 992px) and (max-width: 1199px)
{
	.qram-favorite-list{
		padding-right: 12px;
		}
}


.qram-favorite-detail span,
.qram-favorite-list span{
	display: block;
	position: absolute;
	z-index: 90;
	opacity: 0.99;
	margin-top: 5px;
	margin-right: 5px;
	}

.qram-favorite-list span{
	opacity: 0.55;
	}

.qram-favorite-detail span svg,
.qram-favorite-list span svg{
	display: block;
	margin: auto;
	width: 23px;
	height: 23px;
	}

.qram-favorite-heart path{
	fill: transparent;
	stroke: #ff0000;
	stroke-width: 2;
	transition: fill 0.3s ease, stroke 0.3s ease;
	}

@media (hover: hover) and (pointer: fine)
{
	.qram-favorite-detail:hover .qram-favorite-heart path,
	.qram-favorite-list:hover .qram-favorite-heart path{
	  	stroke-width: 4px;
	  	}

	.qram-favorite-list:hover span{
	  	opacity: 0.99;
	  	}
}

@keyframes qram-favorite-pop-heart-on{
	0%  {transform: scale(1.0); margin-top: 5px; margin-right: 5px;}
	50% {transform: scale(2.5); margin-top: 18px; margin-right: 18px;}
	100%{transform: scale(1.5); margin-top: 10px; margin-right: 10px;}
	}

@keyframes qram-favorite-pop-heart-on-list{
	0%  {transform: scale(1.0); margin-top: 5px; margin-right: 5px; opacity: 0.55;}
	50% {transform: scale(2.5); margin-top: 18px; margin-right: 18px; opacity: 0.99;}
	100%{transform: scale(1.5); margin-top: 10px; margin-right: 10px; opacity: 0.99;}
	}

@keyframes qram-favorite-pop-heart-fill-on{
	0%{fill: transparent;}
	50%{fill: #ff0000;}
	100%{fill: #ff0000;}
	}

@keyframes qram-favorite-pop-heart-off{
	0%  {transform: scale(1.5); margin-top: 10px; margin-right: 10px;}
	50% {transform: scale(2.5); margin-top: 18px; margin-right: 18px;}
	100%{transform: scale(1.0); margin-top: 5px; margin-right: 5px;}
	}

@keyframes qram-favorite-pop-heart-off-list{
	0%  {transform: scale(1.5); margin-top: 10px; margin-right: 10px; opacity: 0.99;}
	50% {transform: scale(2.5); margin-top: 18px; margin-right: 18px; opacity: 0.99;}
	100%{transform: scale(1.0); margin-top: 5px; margin-right: 5px; opacity: 0.55;}
	}

@keyframes qram-favorite-pop-heart-fill-off{
	0%{fill: #ff0000;}
	50%{fill: #ff0000;}
	100%{fill: transparent;}
	}


.qram-favorite-heart{
	transform-origin: center;
	}

.qram-favorite-detail-animate-on,
.qram-favorite-detail-animate-off,
.qram-favorite-detail-animate-on path,
.qram-favorite-detail-animate-off path,
.qram-favorite-list-animate-on,
.qram-favorite-list-animate-off,
.qram-favorite-list-animate-on path,
.qram-favorite-list-animate-off path{
	animation-duration: .9s;
	animation-timing-function: ease-in-out;
	animation-fill-mode: forwards;
	}

.qram-favorite-detail-animate-on{
	animation-name: qram-favorite-pop-heart-on;
	}

.qram-favorite-list-animate-on{
	animation-name: qram-favorite-pop-heart-on-list;
	}

.qram-favorite-detail-animate-off{
	animation-name: qram-favorite-pop-heart-off;
	}

.qram-favorite-list-animate-off{
	animation-name: qram-favorite-pop-heart-off-list;
	}

.qram-favorite-detail-animate-on path,
.qram-favorite-list-animate-on path{
	animation-name: qram-favorite-pop-heart-fill-on;
	}

.qram-favorite-detail-animate-off path,
.qram-favorite-list-animate-off path{
	animation-name: qram-favorite-pop-heart-fill-off;
	}

span.qram-favorite-detail-active,
span.qram-favorite-list-active{
	opacity: 0.99;
	transform: scale(1.5);
	margin-top: 10px;
	margin-right: 10px;
	}

.qram-favorite-detail-active .qram-favorite-heart path,
.qram-favorite-list-active .qram-favorite-heart path{
	fill: #ff0000;
	}

/*** headerbox ***/
.qram-favorite-header-headerbox,
.qram-favorite-header-headerbox-responsive{
	height: 0;
	width: 100%;
	display: none;
	justify-content: flex-start;
	}

.qram-favorite-header-headerbox-flex,
.qram-favorite-header-headerbox-responsive-flex{
	display: flex;
	}

.qram-favorite-header-headerbox-responsive{
	width: 38px;
	height: 30px;
	}

.qram-favorite-header-headerbox div,
.qram-favorite-header-headerbox-responsive div{
	width: 36px;
	height: 36px;
	position: absolute;
	/*margin-left: -45px;*/
	margin-left: 468px;
	margin-top: 2px;
	}

.qram-favorite-header-headerbox-responsive div{
	width: 30px;
	height: 30px;
	}

.qram-favorite-header-headerbox-responsive div{
	margin: auto;
	position: static;
	}

/*
@media (min-width: 1200px) and (max-width: 1439px)
{
	.qram-favorite-header-headerbox div{
		margin-left: 388px;
		}
}

@media (min-width: 992px) and (max-width: 1200px)
{
	.qram-favorite-header-headerbox div{
		margin-left: 319px;
		}
}

@media (min-width: 592px) and (max-width: 992px)
{
	.qram-favorite-header-headerbox div{
		margin-left: 243px;
		}
}
*/

@media (min-width: 592px)
{
	.qram-favorite-header-headerbox div{
		margin-left: 243px;
	}
}

@media (min-width: 992px)
{
	.qram-favorite-header-headerbox div{
		margin-left: 319px;
	}
}
@media (min-width: 1200px)
{
	.qram-favorite-header-headerbox div{
		margin-left: 388px;
	}
}
@media (min-width: 1440px)
{
	.qram-favorite-header-headerbox div{
		margin-left: 468px;
	}
}




@media (max-width: 767px)
{
	.qram-favorite-header-headerbox-flex{
		display: none;
		background: blue;
		}
}


.qram-favorite-header-headerbox svg,
.qram-favorite-header-headerbox-responsive svg{
	cursor: pointer;
	display: block;
	margin: auto;
	width: 32px;
	height: 32px;
	}

.qram-favorite-header-headerbox-responsive svg{
	width: 26px;
	height: 26px;
	}

.qram-favorite-header-headerbox svg:hover path,
.qram-favorite-header-headerbox-responsive svg:hover path{
	stroke: rgb(214,188,127);
	}

.qram-favorite-header-headerbox svg path,
.qram-favorite-header-headerbox-responsive svg path{
	fill: #ff0000;
	}

.qram-favorite-header-headerbox svg text,
.qram-favorite-header-headerbox-responsive svg text{
	font-weight: bold;
	fill: white;
	}

.top-navigation-bar div.qram-favorite-header-dropdown{
	left: 143px;
	}

.qram-favorites-window{
	padding: 5px 10px 5px 10px;
	width: 100%;
	background: #f7f2e6;
	min-width: 300px;
	}

.qram-favorites-window strong{
	display: block;
	text-align: center;
	font-size: 1.5rem;
	padding: 7px 0 15px;
	}

.qram-favorites-window ul{
	margin: 0;
	padding: 0;
	list-style-type: none;
	font-size: 1.4rem;
	}

.qram-favorites-window li{
	margin: 0;
	padding: 3px 5px 3px 0;
	}

.qram-favorites-window div{
	display: flex;
	align-items: center;
	}

.qram-favorites-window button{
	display: block;
	width: 18px;
	min-width: 18px;
	height: 18px;
	font-family: shoptet, sans-serif;
	background: none;
	border: none;
	margin-right: 5px;
	padding: 2px;
	color: var(--color-tertiary);
	border-radius: 40%;
	font-size: 1.1rem;
	line-height: 100%;
	}

.qram-favorites-window button::after{
	content: "\e912";
	}

.qram-favorites-window button:hover{
	background: var(--colors-foregrounds-borders-secondary);
	}

.qram-favorites-window img{
	display: block;
	width: 30px;
	height: 30px;
	}

.qram-favorites-window a{
	display: block;
	flex-grow: 1;
	padding-left: 10px;
	line-height: 100%;
	}

.qram-favorites-window a:hover{
	text-decoration: underline;
	}

.qram-favorites-window-remove{
	text-decoration: line-through;
	opacity: 0.4;
	}