/*******************************************************
*
Theme Name:	   Mindlab-Designs
Theme URI:
Description:
Version:       1.0
Author:        Gerd Baumgartner        
*
*******************************************************/

/* ----------------------------------------------- Startseite ----------------------------------------------- */
/* --------- Startseite ---------*/
#startseite {
	position: absolute;
	height: 100vh;
  height: -webkit-fill-available;
	width: 100vw;
}

#startseite .background{
	position: absolute;
	height: 100vh;
	top: 0;
	left:50%;
	transform: translateX(-50%);
	z-index: -5;
		-o-object-fit: cover;
	   object-fit: cover;
	width: 100%;
}

#startseite .content {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: 100%;
	width: 100%;
}

#startseite .content .logo {
	position: relative;
	display: flex;
  width: 80%;
	max-width: 400px;
	margin: 0 auto;
	flex: 1;
}

#startseite .content .logo img {
	width: 100%;
}

#startseite .content button {
	top: 0;
	left: 0;
	margin: 0 auto 40px auto;
	width: 80%;
	max-width: 400px;
}

/*Standart Breakingpoint 1000px Min-Width*/
@media only screen and (min-width: 1000px){
	#startseite .content {
		justify-content: center;
	}
	
	#startseite .content .logo {
		position: relative;
		display: flex;
		width: 80%;
		max-width: 1000px;
		margin: 30px auto;
    	flex: 0;
	}

	#startseite .content button {
		margin: 30px auto;
		max-width: 300px;
	}
}

/* ----------------------------------------------- Startseite ----------------------------------------------- */
/*----H2-Ueberschriften----*/
.h2_startseite {
	width: 90%;
	margin: 60px auto 20px;
	max-width: 1500px;
}

/*----Slideshows----*/
.Container_Images_Home {
	position: relative;
	display: block;
  	width: 90vw;
	max-width: 1500px;
	margin: 20px auto;
	overflow: hidden !important;
}

.Container_Images_Home .glide__track {
	position: relative;
	overflow: hidden !important;
}

.Container_Images_Home .glide__slide {
    height: auto !important; /* Falls Glide.js feste Höhen setzt */
    width: max-content;
}

.Container_Images_Home .ph-item-box {
    position: relative;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    height: auto !important;  /* Sicherstellen, dass keine feste Höhe vorgegeben wird */
}

.Container_Images_Home .thumbnail {
    flex-grow: 1 !important;
	width: 100% !important;
	margin: 0 auto;
	background-color: var(--black);
	border-radius: 5px;
	padding-bottom: 10px;
}

.Container_Images_Home .ph-product-header, 
.Container_Images_Home .ph-item-desc,
.Container_Images_Home .ph-category-price-box {
    flex-grow: 1 !important;
	margin: 0 5%;
}

.Container_Images_Home .ph-product-header {
	margin: 0 5% 5px;
} 

.Container_Images_Home .thumbnail a {
	position: relative !important;
	display: block;
  	height: 40vw;
	margin: 0 0 10px;
}

.Container_Images_Home .glide__arrows {
  display: block;
}

.Container_Images_Home .glide__arrow {
	position: absolute;
	top: 20vw;
	height: 40px;
	width: 40px;
	border-radius: 20px;
	border: 0;
	background-color: black;
}

.Container_Images_Home .glide__arrow--left {
  left: 10px;
}

.Container_Images_Home .glide__arrow--right {
  right: 10px;
}

.Container_Images_Home .glide__arrow img {
	height: 100%;
	width: 100%;
}

@media only screen and (min-width: 800px){
	.h2_startseite {
		margin: 80px auto 20px;
	}
	
	.Container_Images_Home {
		width: 90%;
		transform: translateX(0);
		overflow: hidden !important;
	}
	
    .Container_Images_Home .ph-item-box {
        max-width: 370px;
    }


    .Container_Images_Home .thumbnail a {
        height: 20vw;
      	max-height: 370px;
    }
	
	.Container_Images_Home .glide__arrows {
		display: block;
	}
	
	.Container_Images_Home .glide__arrow {
		position: absolute;
		top: 32%;
	}
}

@media only screen and (min-width: 1000px){
    .h2_startseite {
    	width: 80%;
    }

    .Container_Images_Home {
    	width: 80%;
    }
	
	.Container_Images_Home .glide__arrow {
		position: absolute;
		top: 35%;
	}
	
	.Container_Images_Home .glide__arrow--left {
	  left: 20px;
	}

	.Container_Images_Home .glide__arrow--right {
	  right: 20px;
	}
	
	
}

/*-----------Hauptslideshow--------------*/
#Startseite_Carousel {
	position: relative !important;;
	width: 90%;
	max-width: 1500px;
	margin: 20px auto;
	display: flex;
	flex-direction: column;
}

#Startseite_Carousel .glide__slide {
	position: relative;
	width: 100%;	
}

#Startseite_Carousel .glide__bullets {
  position: absolute;
	top: 12px;
	width: 90%;
	display: flex;
	height: 0;
}

#Startseite_Carousel .glide__bullet {
	flex: 1;
	border-radius: 5px;
	height: 5px;
}

#Startseite_Carousel .carousel-container {
	position: relative;
	width: 100%;
}

#Startseite_Carousel .carousel-container img {
	position: relative;
	object-fit: cover;
	margin: 0 auto;
	width: 100%;
	height: 100%;
}

#Startseite_Carousel .carousel_content_text {
	position: absolute;
	bottom: 0px;
	width: 80%;
	max-width: 800px;
	text-align: center;
	margin: 20px 0;
	left: 50%;
	transform: translateX(-50%);
}


#Startseite_Carousel .carousel_content_text .carousel_heading {
	margin-bottom: 5px;
}

#Startseite_Carousel .carousel_content_text .carousel_link {
	text-decoration: underline;
}

#Startseite_Carousel .glide__arrow {
	position: absolute;
	height: 40px;
	width: 40px;
	border-radius: 20px;
	border: 0;
	background-color: black;
}

@media only screen and (min-width: 600px){
		#Startseite_Carousel {
		  width: 90%;
	}


	#Startseite_Carousel .carousel-container {
		height: 500px;
	}
}

@media only screen and (min-width: 1000px){
		#Startseite_Carousel {
		  width: 80%;
	}


	#Startseite_Carousel .carousel-container {
		  height: 600px;
	}
	
	#Startseite_Carousel .carousel_content_text {
		margin: 50px 0;
	}
}

/*-----------Werte--------------*/
#startseite_werte {
	width: 80%;
	max-width: 1500px;
	margin: 100px auto 100px;
	display: flex;
	justify-content: space-around;
}

.startseite_werte_container {
	width: 28%;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.startseite_werte_container img {
	height: 8vw;
	min-height: 60px;
	max-height: 80px;
	margin-bottom: 30px;
}

.startseite_werte_container h5 {
	text-align: center;
	margin: 10px 0;
}

.startseite_werte_container p {
	text-align: center;
}

@media only screen and (max-width: 1000px){
	#startseite_werte {
		width: 90%;
	}
	
	.startseite_werte_container img {
		margin-bottom: 30px;
	}
}

@media only screen and (max-width: 700px){
	#startseite_werte {
		width: 60%;
		margin: 50px auto 50px;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}
	
	.startseite_werte_container {
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		margin: 30px 0;
	}
	
	.startseite_werte_container img {
		margin-bottom: 15px;
	}
}

/*-----------Background--------------*/
.startseite_container_beitrag:before {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background-image: url("../images/Background.png");
	background-size: cover;
	background-position: center center;
	z-index: -5;
}

.startseite_container_beitrag:after {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background-color: rgba(0,0,0,0.8);
	z-index: -4;
}

/* ----------------------------------------------- Produktseite ----------------------------------------------- */
/* --------- Ueberschrift ---------*/
.ueberschrift {
	position: relative;
	text-align: center;
	margin: 50px auto 30px;
	width: 90%;
	max-width: 1500px;
}

@media only screen and (min-width: 1000px){
	.ueberschrift {
		width: 80%;
		margin: 100px auto 40px;
	}
}

/* --------- Kategoriemodul ---------*/
.ph-category-module-box {
	position: relative;
	top: 10px;
	width: 100%;
	height: 40px;
	margin: 0 auto;
	overflow: hidden;
}

.ph-category-module-box div {
	width: 90%;
	margin: 0 auto;
	height: 80px; /* 40px - more place for scrollbar, is hidden under parent box */
    padding: 0px;
    white-space: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
}

.ph-category-module-box ul {
	text-align: center;
}

.ph-category-module-box div ul li a {
	color: grey;
}

.ph-category-module-box div ul li.ph-active a {
    color: var(--light);
}

.ph-category-module-box div ul li {
	position: relative;
  display: inline-block;
	margin-left: 1em;
  margin-right: 1em;
	padding: 0 0 12px 0;
}

.ph-category-module-box div ul li:first-child {
	margin-left: 0;
}

.ph-category-module-box div ul li:last-child {
	margin-right: 0;
}

.ph-category-module-box div ul li:before {
    content:'';
    background-image: none;
	padding: 0;
    position: absolute;
    width: 10px;
    bottom: 0;
    left: 50%;
	transform: translateX(-50%);
}

.ph-category-module-box div ul li.ph-active:before {
	border-bottom: 6px dotted var(--light);
}

.ph-category-module-box div ul li.ph-active {
    background: initial;
}

@media only screen and (min-width: 700px){
	.ph-category-module-box {
		height: initial;
		overflow: visible;
		max-width: 1500px;
	}
	
	.ph-category-module-box div {
		position: relative;
		width: 80%;
		height: initial;
		padding: 0px;
		white-space: wrap;
		overflow-x: visible;
		overflow-y: visible;
	}
	
	.ph-category-module-box div ul li {
		margin-bottom: 10px;
	}
}


/* ----------------------------------------------- Links ----------------------------------------------- */
/* --------- Links ---------*/
#links_links_container {
	position: relative;
	background-color: white;
	height: 100vh;
	bottom: 0;
	width: 100%;
	
}

.links_background_top {
	position: absolute;
	top: 0;
	left: 0;
	height: 40%;
	max-height: 250px;
	width: 100%;
	background: url("../images/Muster2.png")
}

.links_logo {
	position: relative;
	width: 80%;
	margin: 0 auto;
	padding-top: 60px;
}

.links_logo img {
	position: relative;
	max-width: 360px;
	width: 100%;
	left: 50%;
	transform: translateX(-50%);
}

.links_text {
	position: relative;
	width: 80%;
	margin: 0 auto;
	padding: 50px 0;
}

.links_text h5 {
  margin: 0 0 20px;
	color: var(--dark);
}

.links_text p {
	color: var(--dark);
}

.links_contact {
	width: 100%;
	position: relative;
	padding: 40px 0;
	background-color: var(--light_semi);
}

.links_contact_container {
	width: 80%;
	margin: 0 auto;
	position: relative;
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	flex-wrap: wrap;
}

.links_contact_block {
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	align-items: center;
	width: 30%;
}

.links_contact_block p{ 
	text-align: center;
	font-family: var(--font-bold);
	font-size: 12px;
	color: var(--dark);
}

.links_contact_block img {
	height: 40px;	
	margin-bottom: 10px;
}

.links_contact_block:last-child {
	position: relative;
  width: 100%;
	margin: 30px 0 0;
}

.links_contact_block button {
	background-color: var(--dark);
	color: var(--light);
}

/* ----------------------------------------------- Items ----------------------------------------------- */
/*Background*/
.phoca-category-image {
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: -5;
}

.phoca-category-image img {
	position: absolute;
	height: 100%;
	width: 100%;
	object-fit: cover;
	z-index: -5;
}

.phoca-category-image:after {
	content: '';
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background-color: rgba(0,0,0,0.8);
	z-index: -4;
}

.ph-item-reward-box .ph-reward,
.ph-category-price-box .ph-price-brutto,
.ph-category-price-box .ph-price-netto,
.ph-category-price-box .ph-price-original,
.ph-category-price-box .ph-price-base,
.ph-category-price-box .ph-tax,
.ph-item-sku-box .ph-sku,
.ph-item-upc-box .ph-upc,
.ph-item-ean-box .ph-ean,
.ph-item-jan-box .ph-jan,
.ph-item-isbn-box .ph-isbn,
.ph-item-mpn-box .ph-mpn,
.ph-item-serial-number-box .ph-serial-number,
.ph-item-min-qty-box .ph-min-qty,
.ph-item-manufacturer-box .ph-manufacturer,
.ph-item-delivery-date-box .ph-delivery-date,
.ph-category-stock-box .ph-stock,
.ph-item-size-box .ph-item-length,
.ph-item-size-box .ph-item-width,
.ph-item-size-box .ph-item-height,
.ph-item-size-box .ph-item-weight,
.ph-item-size-box .ph-item-volume {
    float: right;
}

/* Equal Heights by Flexbox */
.ph-row-flex.grid {
    display: flex;
    flex-wrap: wrap;
}

.ph-row-flex.grid .row-item {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    align-items: stretch;
}

.ph-row-flex.grid .row-item .ph-item-box,
.ph-row-flex.grid .row-item .ph-item-box .ph-thumbnail-c {
    display: flex;
    flex: 1 1 100%;
    /* IE 11 flex: 1 1 auto;*/
    flex-direction: column;
}

/* IE */
.phProductScrollerModuleBox .ph-item-box .ph-thumbnail-c .ph-item-content,
.ph-row-flex.grid .row-item .ph-item-box .ph-thumbnail-c .ph-item-content {
    height: 100%;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    align-items: stretch;
}

.ph-row-flex.grid .row-item .ph-item-box .ph-thumbnail-c .ph-item-content .ph-item-action-box {
    width: 100%;
    margin-top: auto;
}

/* Items */
#phItemsBox {
	width: 90%;
	max-width: 1500px;
	margin: 30px auto;
}

.ph-row-flex {
	width: 100%;
	justify-content: flex-start;
}

.row-item {
	position: relative;
  	width: 100%;
	margin: 5px 0;
}

.ph-item-content {
	width: 100%;
	margin: 0 auto;
	padding-bottom: 10px;
	background-color: var(--black);
	border-radius: 5px;
	overflow: hidden;
}

.ph-category-action-box-icons {
	position: relative;
	height: calc(90vw / 1);
	margin: 0 0 10px;
}

.ph-image {
	left: 50%;
	transform: translateX(-50%);
	position: absolute;
	border-radius: 5px;
	object-fit: cover;
	width: 100%;
	height: 100%;
}


.ph-product-header {
	text-align: left !important;
	position: relative;
	margin: 0 5% 5px;
}

.ph-category-price-box .ph-standard-txt,
.ph-category-price-box .ph-line-through-txt {
  display: none;
}

.ph-item-desc {
	margin: 5px 5%;
}

.ph-category-price-box {
	margin: 0 5%;
}

.ph-category-price-box .ph-price-txt.ph-price-discount {
	position: absolute;
	top: 5%;
	left: 0;
	padding: 8px 20px;
	background-color: var(--discount-primary);
	font-family: var(--font-bold);
	color: var(--light);
}

.ph-category-price-box .ph-price-discount-product {
	padding: 0 10px;
	font-family: var(--font-bold);
	color: var(--light);
}


@media only screen and (min-width: 350px){
	#phItemsBox {
		margin: 30px auto;
	}
	
	.ph-category-action-box-icons {
		height: calc(90vw / 2);
	}
	
	.row-item {
		width: calc(100% / 2);
		margin: 5px 0;
	}

	.ph-item-content {
		width: 95%;
	}
}

@media only screen and (min-width: 700px){
	#phItemsBox {
		margin: 30px auto;
	}
	
	.ph-category-action-box-icons {
		height: calc(90vw / 3);
	}
	
	.row-item {
		width: calc(100% / 3);
		margin: 5px 0;
	}
}

@media only screen and (min-width: 1000px){
		#phItemsBox {
			width: 80%;
			margin: 20px auto;
		}
	
		.ph-category-action-box-icons {
		  	height: calc(80vw / 4);
			max-height: 356px; /*Von Groesster Groesse entnommen*/
	  	}
	
  		.row-item {
			width: calc(100% / 4);
		}
}

/* ----------------------------------------------- Einzelne Produkte ----------------------------------------------- */
/* ----------- Bilder ------------*/
#ph-pc-item-box {
	position: relative;
	width: 90%;
	max-width: 1300px;
	margin: 50px auto;
	display: flex;
	flex-direction: column;
}

.Container_Images {
	width: 100%;
}

.ph-image-full, .ph-image-additional {
	position: relative;
	object-fit: cover;
	width: 100%;
	height: 100%;
	
}

.Container_Images .glide__bullets {
  position: absolute;
	top: 12px;
	width: 90%;
	display: flex;
	height: 0;
}

.Container_Images .glide__bullet {
	flex: 1;
	border-radius: 5px;
	height: 5px;
}

.gslide-image img{
  	width: 50vw !important;
  	max-width: 600px !important;
}

.goverlay {
    background: rgba(0, 0, 0, 0.9) !important; /* Gleiches Design für Desktop und Mobil */
}

@media only screen and (min-width: 600px){
	#ph-pc-item-box {
		display: flex;
		flex-direction: row;
	}
	
	.ph-item-view-data-box {
		flex: 1;
		margin-left: 5%;
	}
	
	.Container_Images {
		width: 45%;
		max-width: 700px
	}
		
	.Container_Images .glide__slides {
		position: relative;
		width: 100% !important;
		transform: translate(0) !important;
		overflow: visible;
		display: flex !important;
		flex-wrap: wrap;
		justify-content: space-between;
	}
		
	.Container_Images .ph-item-image-main {
		width: 100% !important;
		margin: 0 0 2.5px !important;
	}
	
	.Container_Images  .ph-item-image-additional {
		width: 49% !important;
		margin: 0 0 2.5px !important;;
	}
	
	.Container_Images  .glide__bullet {
	 display: none;
  }
}

@media only screen and (min-width: 1000px){	
	.Container_Images  .ph-item-image-main {
		width: 100% !important;
		margin: 0 0 5px !important;
	}
	
	.Container_Images  .ph-item-image-additional {
		width: 49% !important;
		margin: 0 0 5px !important;
	}
}

@media only screen and (min-width: 1000px){
	#ph-pc-item-box {
		width: 80%;
	}
}

@media only screen and (min-width: 1500px){
	#ph-pc-item-box {
		width: 70%;
	}
}

/* ----------- Text ------------*/
.ph-header {
	margin: 20px 0;
}


@media only screen and (min-width: 800px){
	.ph-header {
		margin: 0 0 20px;
	}
}

/* ----------- Price Box ------------*/
.ph-item-price-box .ph-standard-txt,
.ph-item-price-box .ph-line-through-txt {
  display: none;
}

.ph-item-price-box .price_brutto {
	position: relative;
}

.ph-item-price-box {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	width: 100%;
}

.ph-item-price-box .ph-price-txt.ph-price-discount {
	position: relative;
	padding: 5px 15px;
	background-color: var(--discount-primary);
	font-family: var(--font-bold);
	order: 1;
}

.ph-item-price-box .ph-line-through{
	order: 2;
	flex: 1;
	margin: 0 10px;
}

.ph-item-price-box .ph-price-discount-product {
	color: var(--light);
	font-family: var(--font-bold);
	order: 3;
	width: 100%;
	margin: 5px 0;
}

/* ----------- Stock Box ------------*/
.ph-item-stock-box {
	position: relative;
	margin: 10px 0;
	width: 100%;
}

.ph-stock-txt {
	display: none;
}

.ph-stock {
  position: relative;
	display: flex;
	align-items: center;
}

.pc-status-vorrtig::before,
.pc-status-nicht-auf-lager::before,
.pc-status-2---3-tage::before {
	position: relative;
	display: block;
	content: '';
	width: 10px;
	height: 10px;
	border-radius: 10px;
	margin-right: 5px;
}

.pc-status-vorrtig::before {
	background-color: green;
}

.pc-status-nicht-auf-lager::before {
	background-color: red;
}

.pc-status-2---3-tage::before {
	background-color: yellow;
}

/* ----------- Attribute Box ------------*/
.ph-item-attributes-box {
	position: relative;
	margin: 20px 0 30px;
	border-top: solid 1px;
	border-bottom: solid 1px;
	padding-bottom: 10px;
}

.ph-available-options-title {
	width: 100%;
	margin: 10px 0;
}

.ph-attribute-title {
	width: 100%;
	margin: 20px 0 10px;
}

.ph-item-attributes-box .row {
	display: flex;
	justify-content: space-between;
	flex-wrap: nowrap;
  align-items: center;
	margin: 10px 0;
}

.ph-item-attributes-box .row .col-12 .phTextAttributeInput {
	margin-right: 10px;
}

.ph-item-attributes-box .ph-gift-box-form .col-12:nth-child(2) { /*Inputfield*/
	width: 50%;
}

.ph-item-attributes-box .ph-gift-box-form input { /*Inputfield*/
	width: 100%;
	padding: 5px;
}

.phItemHiddenAttributeSelect {
	position: relative;
	display: flex !important;;
	flex-direction: row;
}

.phItemHiddenAttributeSelect .phSelectBoxButton {
	width: 30px;
	height: 30px;
	margin-right: 10px;
	border-radius: 50px;
}

.phItemHiddenAttributeSelect .phSelectBoxButton.on {
	outline: 3px solid;
  	outline-color: white;
}

.phItemBoxAttributeSelect select {
	width: 100%;
	padding: 5px;
}

/* ----------- Add to Cart ------------*/
.ph-item-add-to-cart-box {
	position: relative;
	display: flex;
  	align-items: stretch;	
}

.ph-item-add-to-cart-box .ph-form-quantity {
	background-color: var(--button-light);
	border: 0.5px solid var(--button-light);
	border-radius: 5px;
}

.ph-item-add-to-cart-box .ph-input-quantity {
	width: 30px;
	height: 100%;
	text-align: center;
	padding: 5px;
	border-radius: 5px;
	background-color: var(--button-light);
	color: var(--light);
	border: 0;
}

.ph-item-add-to-cart-box .btn-for-quantity {
	height: 100%;
	margin: 0;
	background-color: var(--button-light);
	color: var(--light);
	border: 0;
}

.ph-item-add-to-cart-box .btn-for-quantity:first-child {
	padding: 5px 0 5px 15px;
}

.ph-item-add-to-cart-box .btn-for-quantity:last-child {
	padding: 5px 15px 5px 0;
}

.ph-item-add-to-cart-box .ph-form-button {
  flex: 1;
	margin-left: 10px;
}

.ph-item-add-to-cart-box .ph-form-button button {
	width: 100%;
	display: flex;
	flex-direction: row-reverse;
	justify-content: center;
	align-items: center;
}

.ph-item-add-to-cart-box .ph-form-button .fa-shopping-bag{
  	display: block;
	margin-left: 15px;
  	height: 25px;
	width: 25px;
  	background: url("../images/icons/Warenkorb.svg");
  	background-repeat: no-repeat;
  	background-size: contain;
}

/* ----------- Description ------------*/
.ph-item-price-panel .desc_long {
	position: relative;
	margin: 30px 0 10px;
	background-color: var(--dark-semi);
	border-radius: 5px;
}

.ph-item-price-panel .desc_long h4 {
	margin-bottom: 0px;
}

/* ----------- Size Options ------------*/
.ph-item-size-options {
	position: relative;
	margin: 10px 0;
	background-color: var(--dark-semi);
	
	border-radius: 5px;
}

.ph-item-size-options h4 {
	margin-bottom: 0;
}

.ph-item-size-box {
	display: flex;
	flex-direction: row;
	justify-content: left;
	align-items: center;
}

.ph-item-length,
.ph-item-width,
.ph-item-height,
.ph-item-weight-txt {
	margin-right: 5px;
}

.ph-item-weight-box {
	display: flex;
	flex-direction: row;
	justify-content: left;
	align-items: center;
	margin-top: 5px;
}

.ph-item-volume-box {
	display: flex;
	flex-direction: row;
	margin-top: 10px;
}

/* ----------- Collapse Options ------------*/
.collapse-content {
    display: none;
	padding: 0 20px 20px;

}

.collapse-content.active {
    display: block;
}

.collapse-title {
	display: flex;
	justify-content: space-between;
	padding: 20px;
}

.collapse-title.active {
	display: flex;
	justify-content: space-between;
	padding: 20px 20px 0;
	margin-bottom: 10px;
}

/* ----------------------------------------------- Modal Dialog ----------------------------------------------- */
/*#phContainerRequest {
	position: absolute;
	top: 0;
	z-index: 10;
}

.modal-dialog {
	position: absolute;
	display: flex;
	justify-content: center;
	align-items: center;
	left: 0;
	width: 100vw;
	height: 100vh;
	background-color: var(--backdrop);
}

.modal-content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 20px;
	background-color: var(--dark);
	border-radius: 5px;
}

.modal-header {
	display: flex;
	flex-direction: row;
}

.modal-title {
	margin-right: 30px;
}

.modal-body .row {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
}

.modal-body .row .ph-center {
	position: relative;
	width: 47.5%;
	text-align: center;
	margin: 5px 0;
}

.modal-body .row .ph-center a {
	position: relative;
	display: block;
	width: 100%;
	text-align: center;
	background-color: var(--dark-semi);
  padding: 10px;
}

@media only screen and (max-width: 400px){
	.modal-content {
		width: 95%;
	}
}*/

/* ----------------------------------------------- Checkout ----------------------------------------------- */
:root {
	--grid_layout: 130px 2fr max-content;
	--img_grid_height: 130px; /*Muss gleich Grid-Layout 1. Breite sein!*/
	--grid_layout_rows: 1fr 1fr max-content;
	--columng_gap: 30px;
	--grid_layout_BP: 75px 1fr max-content;
	--img_grid_height_BP: 75px; /*Muss gleich Grid-Layout-BP 1. Breite sein!*/
	--columng_gap_BP: 10px;
	
}

#ph-pc-checkout-box {
	max-width: 1000px;
	width: 80%;
	margin: 0 auto;
}

#ph-pc-checkout-box .ph-header {
	margin: 60px auto 50px;
  	text-align: center;
}

#phCheckoutCartBox {
	margin-bottom: 50px;
}

/*Item*/
.ph-checkout-cart-row-item {
	display: grid;
	grid-template-columns: var(--grid_layout);
	grid-template-rows: var(--grid_layout_rows);
	column-gap: var(--columng_gap);
	padding: 10px 0;
	border-bottom: 0.5px solid var(--light);
}

.ph-checkout-cart-row-item .ph-row-image {
	position: relative;
	display: block;
	grid-row: 1/4;
	grid-column: 1/2;
	height: var(--img_grid_height);
  align-self: center;
}

.ph-checkout-cart-row-item .ph-checkout-cart-title {
	margin-bottom: 5px;
}

.ph-checkout-cart-row-item .ph-row-image img {
	width: 100%;
}

.ph-checkout-cart-row-item .ph-checkout-cart-title-attributes {
	grid-row: 1/4;
	grid-column: 2/3;
	display: flex;
	flex-direction: column;
	align-items: left;
	padding: 10px 0;
}

.ph-checkout-cart-row-item .ph-checkout-cart-quantity {
	grid-row: 1/2;
	grid-column: 3/4;
	padding: 10px 0;
	text-align: right;
	
}

.ph-checkout-cart-row-item .ph-checkout-cart-quantity .ph-small,
.ph-checkout-attribute-item span {
  	color: var(--light-grey);
}

.ph-checkout-cart-row-item .ph-checkout-cart-cost {
	grid-row: 2/4;
	grid-column: 3/4;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding: 10px 0px;
}

.ph-checkout-cart-row-item .ph-checkout-discount-row {
	display: flex;
	justify-content: flex-end;
}

.ph-checkout-cart-row-item .ph-checkout-cart-row-attributes {
	grid-row: 2/4;
	grid-column: 2/3;
}

.ph-checkout-cart-row-item .ph-checkout-cart-row-attributes li {
  list-style: none;
}

.ph-checkout-cart-row-item .ph-checkout-cart-brutto {
	text-align: right;
	margin-left: 20px;
}

.ph-checkout-cart-row-item .ph-checkout-discount-row .ph-checkout-cart-title {
	position: relative;
	padding: 5px 5px;
	background-color: var(--discount-primary);
	border-radius: 5px;
	font-family: var(--font-bold);
	height: min-content;
}

@media only screen and (max-width: 600px){
	.ph-checkout-cart-row-item {
		grid-template-columns: var(--grid_layout_BP);
		column-gap: var(--columng_gap_BP);
	}

	.ph-checkout-cart-row-item .ph-row-image {
		height: var(--img_grid_height_BP);
	}
		
}

/*Finalpreis*/
.ph-cart-product-discoun.Container_Images_Homet-box,
.ph-cart-subtotal-box,
.ph-cart-total-box,
.ph-cart-shipping-box,
.ph-cart-payment-box {
	display: flex;
	justify-content: flex-end;  
	margin: 10px 0;
	text-align: right;
}

.ph-cart-subtotal-netto,
.ph-cart-product-discount,
.ph-cart-total,
.ph-cart-shipping-brutto,
.ph-cart-payment-brutto {
	margin-left: 20px;
	width: 80px;
	text-align: right;
}

.ph-cart-total,
.ph-cart-total-txt,
.ph-checkout-cart-brutto{
	font-family: var(--font-bold) !important;
}

@media only screen and (max-width: 1000px){
	#ph-pc-checkout-box {
		width: 90%;
	}
	
	#ph-pc-checkout-box .ph-header {
		margin: 40px auto 30px;
	}
}

/*Allgemein - Daten*/
.ph-checkout-box-header,
.ph-checkout-box-header-pas {
	width: 100%;
	display: flex;
	justify-content: space-between;
	flex-direction: row-reverse;
	align-items: center;
	margin: 30px 0 20px;
	padding-left: 20px;
	background-color: var(--dark-semi)
}

.ph-checkout-icon-spec-box {
	height: 100%;
	border-left: 0.5px solid var(--light);
	padding: 10px 20px;
}

/*Rechnungs und Lieferadresse*/
#phCheckoutAddress .ph-checkout-box-action {
  	display: grid;
  	grid-template-columns: 1fr 1fr;
	grid-template-rows: 1fr max-content;
	column-gap: 30px;
}

#phBillingAddress {
	grid-row: 1/2;
	grid-column: 1/2;
	width: 100%;
}

#phShippingAddress {
	grid-row: 1/2;
	grid-column: 2/3;
	width: 100%;
}

#phAdressCheckbox {
	margin: 30px 0 0;
	grid-row: 2/3;
	grid-column: 1/2;
}

#phAdressButton {
	margin: 20px 0 0;
	grid-row: 2/3;
	grid-column: 2/3;
	display: flex;
  	justify-content: flex-end;
}

#phBillingAddress .form-group,
#phShippingAddress .form-group {
	display: flex;
	align-items: center;
	margin: 5px 0;
}

#phBillingAddress .form-group .col-12:first-child,
#phShippingAddress .form-group .col-12:first-child {
	width: 120px;
}

#phBillingAddress .form-group .col-12:last-child,
#phShippingAddress .form-group .col-12:last-child {
	flex: 1;
}

#phBillingAddress .col-12 .form-control,
#phShippingAddress .col-12 .form-control,
#phBillingAddress .col-12 .chosen-select,
#phShippingAddress .col-12 .chosen-select {
	width: 100%;
	padding: 5px;
}

.ph-checkout-box-action .ph-box-header {
	margin: 0 0 15px;
}

.ph-checkout-shipping-row.ph-disabled {
	display: none;
}

.ph-checkout-box-action.adress-entered {
	display: flex;
	justify-content: center;	
}

.ph-checkout-box-action.adress-entered .ph-checkout-row {
 	width: 49%;
}

.ph-checkout-box-action.adress-entered .ph-checkout-row .ph-box-header {
	margin-bottom: 10px;
}

.ph-checkout-box-action.adress-entered .ph-checkout-confirm-row {
  	width: 100%;
	grid-row: 2/3;
	grid-column: 1/3;
	display: flex;
	justify-content: flex-end;
}

@media only screen and (max-width: 800px){
	#phCheckoutAddress .ph-checkout-box-action {
  		display: grid;
		column-gap: 0;
	}

	#phBillingAddress {
		grid-row: 1/2;
		grid-column: 1/3;
		width: 100%;
	}

	#phShippingAddress {
		margin-top: 30px;
		grid-row: 3/4;
		grid-column: 1/3;
		width: 100%;
	}

	#phAdressCheckbox {
		margin: 30px 0 0;
		grid-row: 2/3;
		grid-column: 1/3;
	}
	
	#phAdressButton {
		width: 100%;
		margin-top: 10px;
		grid-row: 4/5;
		grid-column: 1/3;
		display: flex;
		justify-content: flex-end;
	}
	
	.ph-checkout-billing-row {
		grid-row: 1/2;
		grid-column: 1/3;
		width: 100% !important;;
	}
			
	.ph-checkout-shipping-row {
		margin-top: 30px;
		grid-row: 2/3;
		grid-column: 1/3;
		width: 100%;
	}
	
	.ph-checkout-confirm-row {
		grid-row: 3/4 !important;
		grid-column: 1/3;
		width: 100%;
	}
	
	.ph-checkout-box-action .ph-box-header {
		margin: 0 0 15px;
  	}
	
}

/* ----------- Checkout - Versand ------------*/
#phCheckoutAddress {
	position: relative;
}

#phShippingMethods {
	width: 100%;
}

.ph-shipping-container-flex {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
    width: 100%;
	gap: 10px;
}

.ph-shipping-container {
	padding: 10px;
    flex: 1;
	border: 1px solid;
	display: flex;
    flex-direction: column;
    justify-content: space-between; /* Verteilt Inhalt gleichmäßig */
    height: auto; /* Passt sich dem Inhalt an */
}

.ph-shipping-container.selected,
.ph-shipping-container.checked {
	background-color: var(--dark-semi);
}

.ph-shipping-container-flex .ph-checkout-button  {
	margin-top: 0;
	width: 100%;
	display: flex;
	justify-content: flex-end;
}

.ph-checkout-box-action.shipping-entered {
	display: flex;
	flex-direction: column;
}

.ph-shipping-title-box .radio {
	display: none;
}

.ph-shipping-title-box .ph-checkout-shipping-desc {
	margin: 10px 0 0;
}

.ph-shipping-price-box .row {
	position: relative;
	bottom: 0;
	display: flex;
	justify-content: space-between;
	margin-top: 10px;
}

.ph-shipping-price-box .row .ph-checkout-shipping-brutto {
	margin-left: 5px;
	white-space: nowrap;
}

.ph-checkout-box-action.shipping-entered .ph-shipping-title {
	margin-bottom: 10px;
}

/* ----------- Checkout - Zahlungsoptionen ------------*/
#phCheckoutPayment {
	position: relative;
}

#phPaymentMethods {
	width: 100%;
}

.ph-payment-container-flex {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
  width: 100%;
	gap: 10px;
}

.ph-payment-container {
	padding: 10px;
    flex: 1;
	border: 1px solid;
	display: flex;
    flex-direction: column;
    justify-content: space-between; /* Verteilt Inhalt gleichmäßig */
    height: auto; /* Passt sich dem Inhalt an */
}

.ph-payment-container.selected,
.ph-payment-container.checked {
	background-color: var(--dark-semi);
}

.ph-payment-container-flex .ph-payment-container-more {
	margin-top: 5px;
	width: 100%;
}

.ph-payment-container-flex .ph-payment-container-more input {
	padding: 5px;

}

.ph-payment-container-flex .ph-payment-button  {
	display: flex;
	justify-content: flex-end;
}

.ph-payment-container-flex .ph-payment-button p {
	font-family: var(--font-bold);
}

.ph-checkout-box-action.payment-entered {
	display: flex;
	flex-direction: column;
}

.ph-payment-title-box .radio {
	display: none;
}

.ph-payment-title-box .ph-payment-title {
	font-family: var(--font-bold);
}

.ph-payment-title-box .ph-checkout-payment-desc {
	margin: 10px 0 0;
}

.ph-payment-price-box .row {
	position: relative;
	bottom: 0;
	display: flex;
	justify-content: flex-end;
	margin-top: 10px;
}

.ph-payment-price-box .row .ph-checkout-payment-brutto {
	margin-left: 5px;
	white-space: nowrap;
}

.ph-checkout-box-action.payment-entered .ph-payment-title {
	margin-bottom: 10px;
}

/* ----------- Checkout -Rest ------------*/
.ph-cart-empty {
	margin-top: 50px;
}

#phConfirm {
	margin: 20px 0;
}

#phConfirm textarea {
	margin-top: 10px;
	width: 100%;
	height: 60px;
}

.control-group {
	margin: 20px 0;
}

.control-group .controls {
	margin: 10px 0;
}

.ph-checkout-confirm-box-row-checkboxes {
	margin: 20px 0;
}

.ph-checkout-confirm-box-row-checkboxes label input {
	margin: 0 5px 0 0;
}

.ph-checkout-confirm-box-row-checkboxes a {
	text-decoration: underline;
}

.ph-checkout-confirm-box-row-checkboxes .ph-checkout-confirm {
	margin: 20px 0 0;
	display: flex;
	justify-content: flex-end;
}

.ph-checkout-confirm-box-row-checkboxes .ph-checkout-confirm button {

}

/*----------- Button -----------*/
/*.ph-checkout-address-edit --> Wegen Grid anders verwendet,*/
.ph-checkout-shipping-edit,
.ph-checkout-payment-edit {
	width: 100%;
	display: flex;
	justify-content: flex-end;
}

.ph-checkout-address-edit button,
.ph-checkout-shipping-edit button,
.ph-checkout-payment-edit button {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 20px;
	padding: 10px 15px;
}

.ph-checkout-address-edit button::before,
.ph-checkout-shipping-edit button::before,
.ph-checkout-payment-edit button::before {
	content: '';
	background-image: url("../images/icons/Refresh.svg");
	background-size: cover;
	width: 22px;
	height: 25px;
}

.ph-checkout-address-edit span.text,
.ph-checkout-shipping-edit span.text,
.ph-checkout-payment-edit span.text {
	position: relative;
	display: block;
 	margin-left: 10px;
}

/* ----------- Infofenster ------------*/
#ph-pc-info-box {
	width: 90%;
    max-width: 1500px;
	margin: 50px auto 20px;
}

@media only screen and (min-width: 1000px){
	#ph-pc-info-box {
		width: 80%;
	}
}

#ph-pc-info-box .ph-info-shipping-description {
	margin: 20px 0;
}

#ph-pc-info-box .ph-info-shipping-description p {
	margin: 5px 0;
	font-size: 16px;
}