/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */

.selection-area, .bgb-additional-add-to-cart {
	background-color: #f8f8f8;
	margin: 3em 0;
	display:flex;
	justify-content: center;
	flex-direction: row;
	flex-wrap: wrap;	
}
.selected-product {

}
.bgb-selectables {
	display:flex;
	justify-content: center;
	flex-direction: row;
	flex-wrap: wrap;
	margin: 3em 0;
}
.bgb-selectable-product,
.bgb-selected-product
{
	width: 16%;
	padding: 32px 16px;
	text-align: center;
	display: flex;
	flex-direction: column;
}
.add-to-selection-wrapper {
	height: 100%;
	position: relative;
	margin-top: 34px;
}
.bgb-sel-prod-img {
	width: 100%;
	padding-bottom: 100%;
	max-height: 330px;
	background-position:center; 
	background-repeat:no-repeat; 
	background-size:cover;
	cursor: pointer;
	position: relative;
}
.bgb-sel-prod-img:hover .add-to-selection-plus,
.bgb-sel-prod-img:hover .remove-from-selection 
{
	color: #fff;
	opacity: 0.8;
}
.free .remove-from-selection {
	display: none;
}
.unavailable {
	opacity: 0.5;
	cursor: initial;
}
.add-to-selection-plus,
.remove-from-selection,
.not-in-selection 
{
	font-size: 80px;
	color: #d8d8d8;
	margin-top: auto;
	position: absolute;
	top: calc(50% - 40px);
	left: calc(50% - 40px);
	opacity: 0.5;
	transition: opacity 0.3s;
	transition: color 0.3s;
}
.not-in-selection .dashicons-no-alt {
	color: #a8a8a8;
}
.woocommerce button.button.bgb-add-button {
	padding: 8px 24px;
}
.bgb-additional-add-to-cart {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.woocommerce button.single_add_to_cart_button:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}
.woocommerce button.add-to-selection {
	padding: 8px 24px;
	line-height: 17px;
	font-size: 14px;
	position: absolute;
	bottom: 0;
	width: 100%;
	left: 0;	
}
.reason-not-addable .dashicons-info {
	margin-right: 10px;
}
.per-row-2 {
	width: 48%;
}
.per-row-3 {
	width: 33%;
}
.per-row-4 {
	width: 24%;
}
.per-row-5 {
	width: 19%;
}
.per-row-6 {
	width: 16%;
}
.alertify-notifier.ajs-center.ajs-top .ajs-message.ajs-visible {
	top: 5em !important;
}
.alertify-notifier .ajs-message.ajs-success, 
.alertify-notifier .ajs-message.ajs-error 
{
	text-shadow: 1px 1px 0 rgba(0,0,0,.5);
	font-size: 18px;
	font-weight: bold;
}
.alertify-notifier .ajs-message {
	border: 0 !important;
	box-shadow: 0px 0px 5px #000;
}
.bgb-additional-add-to-cart form.cart {
	display:flex;
}
.display-flex {
	display:flex;
}
.reason-not-addable {
	display:none;
}
/* Medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {
	.per-row-2,
	.per-row-3,
	.per-row-4,
	.per-row-5,
	.per-row-6 
	{
		width: 24%;
	}
}


/* Small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
	.per-row-2,
	.per-row-3,
	.per-row-4,
	.per-row-5,
	.per-row-6 
	{
		width: 33%;
	}
}


/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) { 
	.per-row-2,
	.per-row-3,
	.per-row-4,
	.per-row-5,
	.per-row-6 
	{
		width: 48%;
	}
}

/* Large devices (desktops, less than 1200px) */
/* @media (max-width: 1199.98px) { ... }*/