/* ==========================================================================
  Product Teaser
  ========================================================================== */

	.product-teaser .text-wrapper,
	.fl-content .product-teaser .text-wrapper,
	.fl-content.white .product-teaser .text-wrapper{ 
		border-bottom: 1px solid #d2d2d2;
		border-left: 1px solid #d2d2d2;
		border-right: 1px solid #d2d2d2;
		padding: 1rem 1.2rem 1.4rem 1.2rem;
	}
  
	.product-teaser .campaign-availability{
		clear: both;
		margin-bottom: 0;
	}
  
	.product-teaser .campaign-availability,
	.teaser-bottom{
		margin-top: 1.25rem;
	}
  
	.product-teaser .teaser-bottom .ajax_add_to_cart.add_to_cart_button.loading:before{
		animation: spinner 1.1s infinite linear;
		border: .188rem solid #ffffff;
		border-left: .188rem solid transparent;
		border-radius: 50%;
		content: '';
		display: block;
		height: 46%;
		margin-left: -23%;
		margin-top: -23%;
		position: absolute;
		left: 50%;
		top: 50%;
		width: 46%;
		z-index: 20;
	}
	
	@-webkit-keyframes spinner {
		0% {
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}
		100% {
			-webkit-transform: rotate(360deg);
			transform: rotate(360deg);
		}
	}
    
	@keyframes spinner {
		0% {
			-webkit-transform: rotate(0deg);
			transform: rotate(0deg);
		}
		100% {
			-webkit-transform: rotate(360deg);
			transform: rotate(360deg);
		}
	}
  
	.product-teaser .teaser-bottom .ajax_add_to_cart.add_to_cart_button.added:before{
		content: '';
		background-image: url('../images/icons/icon_cart_added_haken.svg');
		background-repeat: no-repeat;
		display: block;
		height: 40%;
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-45%, -50%);
		width: 40%;
	}
  
	.product-teaser .teaser-bottom .ajax_add_to_cart.add_to_cart_button.added:after{
		display: none;
	}
  
	.product-teaser .teaser-bottom .ajax_add_to_cart.add_to_cart_button.loading .cc-cart-icon,
	.product-teaser .teaser-bottom .ajax_add_to_cart.add_to_cart_button.loading .cc-css-cart-icon,
	.product-teaser .teaser-bottom .ajax_add_to_cart.add_to_cart_button.added .cc-cart-icon,
	.product-teaser .teaser-bottom .ajax_add_to_cart.add_to_cart_button.added .cc-css-cart-icon{
		display: none;
	}
  
	.product-teaser .teaser-bottom .added_to_cart{
		display: none;
		visibility: hidden;
	}
  
	.product-teaser a{
		text-decoration: none;
	}
  
	.woocommerce ul.products li.product strong{
		display: inline;
	}

	.woocommerce ul.products li.product-teaser,
	.woocommerce ul.products li.product-teaser .price,
	.product-teaser,
	.product-teaser a,
	.product-teaser .price{
		color: var(--fl-global-schrift-dunkel, #141414);
	}
		
	.product-teaser dt{
		font-weight: 400;
	}
	
	.product-teaser .teaser .button{
		transition: transform .3s ease-in-out;
	}
	
	.product-teaser .teaser:hover .button{
		transform: scale(1.2);
	}
	
	.woocommerce[class*=columns-] ul.products li.product-teaser,
	.woocommerce ul.products li.product-teaser,
	.woocommerce-product-grid .woocommerce ul.products li.product-teaser,
	.product-teaser{
		color: var(--fl-global-schrift-dunkel, #141414);
		max-width: 25rem;
		text-align: left;
	}
	
	.product-teaser .image-wrapper{
		margin-bottom: 0;
		position: relative;
	}
	
	.product-teaser .image-wrapper .campaign-duration-wrapper{
		display: block;
		line-height: 1;
		margin-left: 1.25rem;
		margin-top: 1.25rem;
		margin-right: 1.25rem;
		position: absolute;
		top: 0;
	}

	.product-teaser .image-wrapper .campaign-duration{
		background-color: var(--fl-global-mango, #ffcd7B);
		border-radius: 1.25rem;
		display: inline-block;
		font-size: .75rem;
		left: 0;
		line-height: 1.2;
		margin-bottom: .3rem;
		margin-right: .8rem;
		padding: .125rem .563rem;
	}
	
	.product-teaser .image-wrapper .campaign-duration.sold-out{
		background-color: var(--fl-global-orange, #ff8e6a);
	}
	
	.product-teaser .image-wrapper .campaign-duration.banane{
		background-color: var(--fl-global-banane, #fff29d);
	}
	
	.product-teaser .image-wrapper .campaign-duration.limoncello{
		background-color: var(--fl-global-limoncello, #effe93);
	}
	
	.product-teaser .image-wrapper .campaign-duration.mango{
		background-color: var(--fl-global-mango, #ffcd7B);
	}
	
	.product-teaser .image-wrapper .campaign-duration.pistazie{
		background-color: var(--fl-global-pistazie, #dced76);
	}
	
	.product-teaser .image-wrapper .campaign-duration strong,
	.product-teaser .image-wrapper .campaign-duration b{
		font-size: .813rem;
	}
	
	.product-teaser .image-wrapper .campaign-duration strong,
	.product-teaser .image-wrapper .campaign-duration.sold-out,
	.product-teaser .image-wrapper .campaign-duration b,
	.product-teaser .price,
	.woocommerce ul.products li.product-teaser .price,
	.product-teaser .teaser-title{
		font-family: 'Archeron Pro';
		font-weight: 500;
	}
	
	.product-teaser img,
	.product-teaser .woocommerce-placeholder,
	.woocommerce ul.products li.product-teaser img,
	.woocommerce ul.products li.product-teaser .woocommerce-placeholder{
		border: 0;
		height: auto;
		margin-bottom: 0;
		max-width: none;
		width: 100%;
	}
	
	.product-teaser a img,
	.product-teaser a:hover img,
	.product-teaser a:hover .woocommerce-placeholder,
	.product-teaser .woocommerce-placeholder,
	.woocommerce ul.products li.product-teaser a img,
	.woocommerce ul.products li.product-teaser a:hover img,
	.woocommerce ul.products li.product-teaser .woocommerce-placeholder,
	.woocommerce ul.products li.product-teaser a:hover .woocommerce-placeholder{
		border: 0;
		margin-bottom: 0;
	}
	
	.woocommerce ul.products li.product-teaser .teaser-title,
	.product-teaser .teaser-title{
		font-size: 1.625rem;
		line-height: 1.23;
		margin-bottom: .4rem;
		padding: 0;
	}
	
	.woocommerce ul.products li.product-teaser .price,
	.product-teaser .price{
		display: block;
		font-size: 1.375rem;
	}
	
	.product-teaser .campaign-availability dt{
		float: left;
		line-height: 1.2rem;
		vertical-align: bottom;
	}
	

	.product-teaser .campaign-availability dd{
		display: block;
		line-height: 1.2rem;
		margin-bottom: .8rem;
		padding-left: 50%;
		padding-bottom: 10px;
		position: relative;
		text-align: right;
		vertical-align: bottom;
	}

	.product-teaser .campaign-availability dd:after,
	.product-teaser .campaign-availability dd:before{
		bottom: 0;
		content: '';
		display: block;
		height: 6px;
		left: 0;
		position: absolute;
	}
	
	.product-teaser .campaign-availability dd:after{
		background-color: var(--cc-global-schrift-dunkel, #141414);
		width: var(--fill, 0%);
	}

	.product-teaser .campaign-availability dd:before{
		background-color: var(--cc-global-grau-hell, #e8e8e8);
		width: 100%;
	}

	.product-teaser .campaign-availability dt,
	.product-teaser .product-amount{
		font-size: .875rem;
	}
	
	.product-teaser .producer-info{
		padding-top: 0;
	}
	
	.product-teaser .campaign-availability dd,
	.product-teaser .producer-info{
		font-size: .75rem;
	}
	
	.product-teaser .woocommerce-Price-currencySymbol{
		font-size: 70%;
	}
	
	.woocommerce ul.products li.product-teaser .price,
	.product-teaser .price,
	.product-teaser .producer-info{
		margin-bottom: 0;
	}
	
	body.woocommerce-page.archive li.product-teaser a.button:is(.add_to_cart_button, .gotolink),
	body.woocommerce-page.single-product li.product-teaser a.button:is(.add_to_cart_button, .gotolink),
	.woocommerce-page ul.products li.product-teaser a.button,
	/*.woocommerce-page ul.products li.product-teaser a:hover.button,*/
	.woocommerce ul.products li.product-teaser a.button,
	/*.woocommerce ul.products li.product-teaser a:hover.button,
	.product-teaser a:hover.button,*/
	.product-teaser .button{
		background-color: var(--fl-global-schrift-dunkel, #141414);
		border: none;
		border-radius: 50%;
		display: inline-block;
		height: 3.6rem;
		margin-top: 0;
		position: relative;
		width: 3.6rem;
	}
	
	.product-teaser .cc-css-goto-icon,
	.product-teaser .cc-css-cart-icon,
	.product-teaser .cc-cart-icon{
		left: 50%;
		position: absolute;
		top: 50%;
		transform: translate(-50%, -50%);
		width: 50%;
	}

	.product-teaser .cc-css-goto-icon,
	.product-teaser .cc-css-cart-icon{
		background-repeat: no-repeat;
		background-size: contain;
	}

	.product-teaser .cc-css-cart-icon{
		background-image: url('../images/icons/icon_cart_white.svg');
		height: 28px;
		width: 30px;
	}

	.product-teaser .cc-css-goto-icon{
		background-image: url('../images/icons/icon_arrow_white.svg');
		height: 10px;
		width: 24px;
	}
  
  /* ==========================================================================
    Tablet-Styles für Product Teaser
    ========================================================================== */
  
	@media (max-width: 1000px) {
		.woocommerce-page ul.products li.product-teaser a.button,
		/*.woocommerce-page ul.products li.product-teaser a:hover.button,*/
		.woocommerce ul.products li.product-teaser a.button,
		/*.woocommerce ul.products li.product-teaser a:hover.button,*/
		/*.product-teaser a:hover.button,*/
		.product-teaser .button{
			height: 3rem;
			width: 3rem;
		}
	}
  
  
  /* ==========================================================================
    Palm-Styles für Product Teaser
    ========================================================================== */
  
	@media (max-width: 768px) {
	
		.product-teaser .text-wrapper,
		.fl-content .product-teaser .text-wrapper,
		.fl-content.white .product-teaser .text-wrapper{ 
			padding: .875rem 1rem 1.125rem 1rem;
		}
	
		.product-teaser .image-wrapper .campaign-duration{
			font-size: .625rem;
		}
	
		.product-teaser .teaser:hover .button{
			transform: scale(1.16);
		}
	
		.product-teaser .image-wrapper .campaign-duration strong,
		.product-teaser .image-wrapper .campaign-duration b{
			font-size: .688rem;        
		}
	
		.woocommerce ul.products li.product-teaser .teaser-title,
		.product-teaser .teaser-title{
			font-size: 1.25rem;
			line-height: 1.2;
			margin-bottom: .2rem;
		}
	
		.woocommerce ul.products li.product-teaser .price,
		.product-teaser .price{
			font-size: 1.063rem;
		}
	
		.woocommerce-page ul.products li.product-teaser a.button,
		/*.woocommerce-page ul.products li.product-teaser a:hover.button,*/
		.woocommerce ul.products li.product-teaser a.button,
		/*.woocommerce ul.products li.product-teaser a:hover.button,
		.product-teaser a:hover.button,*/
		.product-teaser .button{
			height: 3.4rem;
			width: 3.4rem;
		}
	
		.product-teaser .campaign-availability dd{
			margin-bottom: .6rem;
			padding-bottom: 8px;
		}
	
		.product-teaser .campaign-availability dd:after,
		.product-teaser .campaign-availability dd:before{
			height: 5px;
		}

		.product-teaser .campaign-availability dt,
		.product-teaser .product-amount{
			font-size: .8rem;
		}
	
		.product-teaser .image-wrapper .campaign-duration,
		.product-teaser .campaign-availability dd,
		.product-teaser .producer-info{
			font-size: .72rem;
		}
	
		.product-teaser .image-wrapper .campaign-duration strong,
		.product-teaser .image-wrapper .campaign-duration b{
			font-size: .8rem;
		}
	
	}
  
  /* ==========================================================================
    Mobile-Styles für Product Teaser
    ========================================================================== */
  
    @media (max-width: 600px) {
  
		.product-teaser .text-wrapper,
		.fl-content .product-teaser .text-wrapper,
		.fl-content.white .product-teaser .text-wrapper{ 
			padding: .875rem 1.2rem 1.125rem 1.2rem;
		}
	
		.woocommerce ul.products li.product-teaser .teaser-title,
		.product-teaser .teaser-title{
			font-size: 2rem;
			margin-bottom: .2rem;
		}
	
		.product-teaser .teaser-bottom{
			min-height: 4rem;
		}
	
		.product-teaser .campaign-availability,
		.teaser-bottom{
			margin-top: 2rem;
		}
	
		.woocommerce ul.products li.product-teaser .price,
		.product-teaser .price{
			font-size: 1.8rem;
			line-height: 1.1;
		}
	
		.woocommerce-page ul.products li.product-teaser a.button,
		/*.woocommerce-page ul.products li.product-teaser a:hover.button,*/
		.woocommerce ul.products li.product-teaser a.button,
		/*.woocommerce ul.products li.product-teaser a:hover.button,
		.product-teaser a:hover.button,*/
		.product-teaser .button{
			height: 4.2rem;
			width: 4.2rem;
		}
	
		.product-teaser .campaign-availability dd{
			margin-bottom: 1.4rem;
			padding-bottom: 16px;
			padding-left: 40%;
		}
	
		.product-teaser .campaign-availability dd:after,
		.product-teaser .campaign-availability dd:before{
			height: 8px;
		}

		.product-teaser .campaign-availability dt,
		.product-teaser .product-amount{
			font-size: 1.2rem;
		}
	
		.product-teaser .image-wrapper .campaign-duration,
		.product-teaser .campaign-availability dd,
		.product-teaser .producer-info{
			font-size: 1rem;
		}
	
		.product-teaser .image-wrapper .campaign-duration strong,
		.product-teaser .image-wrapper .campaign-duration b{
			font-size: 1.1rem;
		}
	
		.product-teaser .image-wrapper .campaign-duration{
			margin-bottom: .6rem;
			margin-right: 1rem;
			padding: .125rem .625rem .188rem;
		}

  	}
  
  /* ==========================================================================
    Mini-Styles für Product Teaser
    ========================================================================== */

	@media (max-width: 360px) {

		.product-teaser .teaser-bottom .teaser-link{
			display: block;
			margin-bottom: 1.6rem;
		}

		.product-teaser .campaign-availability dt {
			float: none;
			line-height: 1.2rem;
			margin-bottom: .2rem;
		}

		.product-teaser .campaign-availability dd {
			line-height: 1.2rem;
			margin-bottom: 1.6rem;
			padding-left: 0;
			padding-bottom: 18px;
			position: relative;
			text-align: left;
		}
	}

  /* ==========================================================================
    Palm-Styles für Product Teaser
    ========================================================================== */

	@media (min-width: 320px) {
		.product-teaser .teaser-bottom{
			position: relative;
		}
		body.woocommerce-page.archive li.product-teaser a.button:is(.add_to_cart_button, .gotolink),
		body.woocommerce-page.single-product li.product-teaser a.button:is(.add_to_cart_button, .gotolink),
		.woocommerce-page ul.products li.product-teaser a.button,
		/*.woocommerce-page ul.products li.product-teaser a:hover.button,*/
		.woocommerce ul.products li.product-teaser a.button,
		/*.woocommerce ul.products li.product-teaser a:hover.button,
		.product-teaser a:hover.button,*/
		.product-teaser .button{
			bottom: 0;
			position: absolute;
			right: 0;
		}

	}
  

  /* ==========================================================================
    Desktop-Styles für Product Teaser
    ========================================================================== */
	
	@media (min-width: 768px) {
		.product-teaser .teaser-bottom{
			min-height: 3.125rem;
		}
	}
  
  
  /* ==========================================================================
    Grid-Styles für Product Teaser
    ========================================================================== */
  
    @supports (display: flex) {
		.cc-gb-products ul.products,
		.woocommerce-product-grid .woocommerce ul.products {
			list-style: none outside;
			clear: both;
		}
		.cc-gb-products ul.products{
			padding-left: 0;
			padding-right: 0;
		}
	
	
		.woocommerce-product-grid .woocommerce ul.products {
			margin: 0 0 1em;
			padding: 0;
		}
		
		.cc-gb-products ul.products li.product,
		.woocommerce-product-grid .woocommerce ul.products li.product {
			width: 100%;
			margin: 0 auto 2.992em auto;
		}
	
		.cc-gb-products ul.products li.product-teaser:last-child,
		.woocommerce ul.products li.product-teaser:last-child {
			margin-bottom: 0;
		}
  
		@media (min-width: 600px) {
			.product-teaser .text-wrapper,
			.fl-content .product-teaser .text-wrapper{
				display: flex;
				flex-direction: column;
				flex: 1;
			}
			.product-teaser .teaser{
				display: flex;
				flex-direction: column;
				height: 100%;
			}
			.product-teaser .teaser-bottom,
			.fl-content .product-teaser .teaser-bottom{
				margin-top: auto;
				padding-top: 1.25rem;
			}
	
			.cc-gb-products .products,
			.woocommerce-product-grid .woocommerce .products,
			.woocommerce .products.columns-4{
				display: flex;
				flex-flow: row wrap;
				margin-bottom: -1.25rem;
				margin-left: -.625rem;
				margin-right: -.625rem;
			}
	
			.cc-gb-products ul.products li.product-teaser,
			.woocommerce.columns-4 ul.products.columns-4 li.product-teaser, 
			.woocommerce-page.columns-4 ul.products.columns-4 li.product-teaser, 
			.woocommerce.woo-4.archive ul.products.columns-4 li.product-teaser, 
			.woocommerce-page.woo-4.archive ul.products.columns-4 li.product-teaser,
			.woocommerce-product-grid .woocommerce ul.products.columns-4 li.product-teaser{
				float: none !important;
				width: auto !important;
			}
	
			.cc-gb-products ul.products li.product-teaser,
			.woocommerce ul.products.columns-4 li.product-teaser,
			.woocommerce-product-grid .woocommerce ul.products li.product-teaser,
			.woocommerce ul.products li.product-teaser{
				float: none;
				flex: 0 0 50%;
				height: auto;
				margin: 0;
				max-width: 50%;
				padding-bottom: 1.25rem;
				padding-left: .625rem;
				padding-right: .625rem;
				width: auto;
			}
		}
  
		@media (min-width: 992px) {
			.cc-gb-products ul.products.columns-4 li.product-teaser,
			.woocommerce.archive ul.products.columns-4 li.product-teaser,
			.woocommerce-product-grid .woocommerce ul.products li.product-teaser,
			.woocommerce.archive ul.products li.product-teaser{
				float: none;
				flex: 0 0 33.333%;
				height: auto;
				margin: 0;
				max-width: 33.333%;
				width: auto;
			}
			.cc-gb-products ul.products{
				margin-left: -5%;
				width: 110%;
			}
		}
  
		@media (min-width: 1200px) {
			.cc-gb-products ul.products.columns-4{
				margin-left: -25%;
				width: 150%;
			}
			.cc-gb-products ul.products.columns-4 li.product-teaser,
			.woocommerce.archive ul.products.columns-4 li.product-teaser,
			.woocommerce-product-grid .woocommerce ul.products.columns-4 li.product-teaser,
			.woocommerce.archive ul.products li.product-teaser{
				float: none;
				flex: 0 0 25%;
				height: auto;
				margin: 0;
				max-width: 25%;
				width: auto;    	            
			}
		}
  
		@media (min-width: 1350px) {
			.cc-gb-products ul.products,
			.woocommerce.archive ul.products,
			.woocommerce-product-grid .woocommerce ul.products{
				margin-left: -5%;
				width: 110%;
			}
		}
  
		@media (min-width: 1500px) {
			.cc-gb-products ul.products.columns-4{
				margin-left: -40%;
				width: 180%;
			}
			.cc-gb-products ul.products,
			.woocommerce-product-grid .woocommerce ul.products,
			.woocommerce.archive ul.products{
				margin-left: -10%;
				width: 120%;
			}
		}
  	}