﻿.articlebox {
	padding: 20px 10px;
}

#template {
	margin-left: 3px;
}

.articleAction, .articleInfo {
	display: inline-block;
}

.articleAction {
	padding-top: 25px;
	padding-bottom: 15px;
	min-width: 400px;
}

	.articleAction ul > li {
		margin-bottom: 10px;
	}

.breadcrumb {
	margin-bottom: 0px !important;
	/*margin-top: 90px;*/
	font-family: var(--default-font);
	font-size: 14px;
	text-align: left;
	line-height: 28px;
}

.breadcrumb > li > a {
	color: #999;
	cursor: pointer;
	transition: all 0.1s linear 0s;
}

.breadcrumb > li > a:hover {
	color: var(--default-primary-color);
	border-bottom: 1px solid var(--default-primary-color);
	cursor: pointer;
}


.articleEAV {
	padding: 20px 0;
	float: left;
	width: 100%;
}

	.articleEAV > div {
		padding: 10px;
	}

	.articleEAV .factEAN li {
		padding: 10px;
	}

		.articleEAV .factEAN li span {
			display: inline-block;
		}

		.articleEAV .factEAN li:nth-child(odd) {
			background-color: #EEEEEE;
		}

	.articleEAV .nav-tabs li:not(.active) a {
		border: 1px solid #ddd;
		border-radius: 4px 4px 0 0;
		color: #3C3C3C;
		background-color: #EEEEEE;
	}

	.articleEAV .nav-tabs > li > a {
		border: 0;
	}

.eav-tab, #Facts, #Description {
	padding-left: 0 !important;
}


.articleInfo {
	width: 60%;
	padding: 0 20px;
}

	.articleInfo ul > li {
		padding: 5px;
		float: left;
		width: 100%;
	}
	/*.articleInfo div:nth-child(2) {
    margin-right: 20%;
}*/
	.articleInfo .glyphicon {
		font-size: 17px;
	}

	.articleInfo .glyphicon-ok {
		color: green;
	}

	.articleInfo .yellow {
		color: #ffbc34;
	}

	.articleInfo .blue {
		color: #1A6C9B;
	}

	.articleInfo .red {
		color: #EB5A49;
	}

.articleImage {
	position: relative;
}

.articleImage, .articleInfo {
	float: left;
}

	.articleImage .sp-large {
		text-align: center;
	}


.sp-wrap {
	margin: 0px !important;
	height: 310px !important;
	width: 455px !important;
}

.sp-thumbs {
	display: inline-grid !important;
	float: right;
	overflow: auto;
	height: -webkit-fill-available;
}

/* width */
sp-thumbs::-webkit-scrollbar {
	width: 10px !important;
}

/* Track */
sp-thumbs::-webkit-scrollbar-track {
	background: #f1f1f1 !important;
}

/* Handle */
sp-thumbs::-webkit-scrollbar-thumb {
	background: #888 !important;
}

	/* Handle on hover */
	sp-thumbs::-webkit-scrollbar-thumb:hover {
		background: #555 !important;
	}

.articleImage {
	width: 23% !important;
}

@media(max-width: 530px) {
	.articleImage {
		width: 100% !important;
		height: auto !important;
	}
}

.slick-track {
	align-items: center;
}

.slick-slide img {
	max-width: 100%;
	height: auto;
}

.slider-single {
	border-bottom: 1px solid #ddd;
}

.big-thumbnail {
	cursor: -moz-zoom-in;
	cursor: -webkit-zoom-in;
	cursor: zoom-in;
	margin: auto;
}

.articleDescription {
	clear: both;
}

#readMore {
	color: var(--default-primary-color);
}

#readMore:hover {
	color: var(--default-primary-color-hover);
}

.articleList li {
	position: relative;
}

.articleImage .campaign {
	width: 80px;
	height: 80px;
	padding-top: 25px;
}

.campaign {
	position: absolute;
	background: #C11201;
	color: white;
	border-radius: 50%;
	text-align: center;
	font-weight: bold;
	z-index: 1;
	line-height: 30px;
	font-size: 25px;
	font-weight: bold;
}

.articlebox .campaign {
	margin: 10px;
	padding: 10px 5px;
}

.campaignlight {
	padding: 6px;
	font-size: 17px;
}

.campaignBox {
	border: 5px solid;
	border-color: #F8E0B2;
	border-radius: 5px;
	padding: 5px 30px;
	margin-top: 15px;
	margin-bottom: 40px;
	width: 75%;
}

	.campaignBox a {
		margin-bottom: 10px;
		display: inline-block;
	}

.articleInfo p {
	list-style: disc Inside none;
	display: list-item;
}

.oldPrice, .newPrice, .price {
	font-weight: normal;
	font-size: 14px;
	margin-right: 10px;
}

.oldPrice {
	text-decoration: line-through;
	font-size: 14px;
}

.newPrice {
	color: var(--default-primary-color) !important;
}

.price-single-brutto {
	text-decoration: line-through;
}
.price-single-brutto-list, .price-single-brutto-grid {
	text-decoration: line-through;
	font-size: 14px;
	font-family: var(--default-font);
	color: #999;
}

.price-single-brutto-list{
	float: right;
}

.red {
	color: red;
}

.yellow {
	color: #facc00;
	color: rgba(250, 204, 0, 1);
}

.green {
	color: green;
}

.glyphicon glyphicon-ok {
	color: green;
	font-size: 16px;
}

.glyphicon glyphicon-remove {
	color: red;
	font-size: 16px;
}

.articleInfo > form > input {
	width: 30%;
	float: left;
}

.articleInfo .glyphicon-remove {
	color: #EB5A49;
}

.articleInfo .buy-article {
	margin: 6px 20px;
	font-weight: bold;
}

.print-btn {
	color: #FFFFFF;
	background-color: var(--default-secondary-color);
	height: 45px !important;
	margin-top: 6px;
	margin-left: 3px;
	padding-top: 9px !important;
}

	.print-btn:hover {
		background: #595959;
	}

.print-btn-nobuy {
	margin-top: 23px !important;
}

#offert-modal .modal-content {
}

#offert-modal .close {
	margin-top: -7px;
	margin-right: -20px;
}

.none {
	display: none;
}

#priceQuotationForm {
	margin: 10px 10px;
}

#priceQuotationBtn {
	margin-top: 10px;
}

.priceQuotationSent {
	margin: 10px;
	color: green;
	font-size: 20px;
	font-weight: bold;
}

.closePriceQuotationModal {
	position: absolute;
	right: 10px;
	bottom: 10px;
}

.priceQuotationModal-content {
	border: unset !important;
	padding: 10px 10px 45px 10px;
	box-shadow: unset !important;
	margin-top: -25px;
}

#modalLoader {
	margin-top: 5px;
}


.articleInfo .buy-article, .buyArea .buy-article {
	background-color: #E94D3E;
	background: #1FAD24;
	color: #fff;
	box-shadow: 2px 2px 0 #0C5612;
	border: 0;
	border-radius: 5px;
	margin: 6px;
}


.big {
	font-size: 28px;
}

.select-label {
	font-size: 11px;
}

.articleDescription {
	margin: 5px;
	padding: 5px;
	border: solid 1px #DDDDDD;
	border-radius: 5px;
}

#offert-modal .close {
	margin-top: -7px;
	margin-right: -20px;
}

#offert-modal .modal-content {
	margin-top: -25px;
	border: none;
	box-shadow: none !important;
	padding-bottom: 1px;
}

#priceQuotationForm {
	margin: 10px 10px;
}

#priceQuotationBtn {
	margin-top: 10px;
}

.disable {
	opacity: 0.4;
	pointer-events: none;
	cursor: default;
}

#viewLoading {
	width: initial !important;
	position: absolute;
	z-index: 10;
	margin-left: 300px;
	margin-top: 150px;
}

@media screen and (max-width: 992px) {
	.articleInfo .form-control {
		width: 100% !important;
	}
}


.articleEAV .factEAN div > :first-child {
	font-weight: 700;
}

.replaced-by {
	color: #83b719;
}

#stockStatus a:hover {
	text-decoration: underline;
}

table.headlinesTechSpec {
    width: 100%;
    margin-top:24px;
}

.tbodyTechspecs tr:nth-child(odd) {
    background-color: #EEEEEE;
    font-size: 14px;
}
.tbodyTechspecs td {
    line-height: 24px;
    padding: 10px;
}
.hTechSpec th {
    font-size: 16px;
    font-weight:700;
}

/******SLICK*******/
.slick-slide {
	opacity: 0.4;
	height: auto;
}

.slick-list {
	height: auto !important;
}

.slick-track {
	margin-left: 0 !important;
	display: flex !important;
	align-items: center;
}

.slick-next::before, .slick-prev::before {
	font-size: 30px !important;
}

.slick-prev, .slick-next {
	z-index: 1000;
	height: 30px !important;
	width: 30px !important;
}

.slick-prev {
	left: 4px !important;
}

.slick-next {
	right: 4px !important;
}

.is-active, .slick-current {
	opacity: 1 !important;
}

.btn-back-chevron {
	color: var(--default-primary-color);
	font-size: 18px;
}

.btn-back-chevron:hover {
	color: var(--default-primary-color);
}

#previewImageModal {
	overflow: hidden;
	text-align: center;
}

.previewImageModal-content-single .modal-img {
	width: auto;
}

.modal-img {
	margin: auto;
	max-height: 100vh;
}

.previewImageModal-content, .previewImageModal-content-single {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	background-color: rgba(0, 0, 0, 0.7);
}

.modal-slides {
	display: flex !important;
	align-items: center;
	height: 100vh;
}


/*.previewImageModal-content slick-next::before {
	font-size: 100px !important;
	margin-right: 40%;
}*/


/*.modal-slides {
	margin-top: 17% !important;
}

@media (max-width: 1024px) {
	.modal-slides {
		margin-top: 22% !important; 
	}
}

@media (max-width: 768px) {
	.modal-slides {
		margin-top: 26% !important;
	}
}

@media (max-width: 630px) {
	.modal-slides {
		margin-top: 38% !important;
	}
}

@media (max-width: 500px) {
	.modal-slides {
		margin-top: 100% !important;
	}
}*/


.back-btn {
	vertical-align: inherit;
	margin-bottom: 20px;
	color: #999;
	background: transparent;
	border: 1px solid transparent;
	border-radius: 2px;
	font-size: 16px;
	line-height: 24px;
	height: auto;
	padding: 0;
}

.back-btn:hover {
	color: var(--default-primary-color);
	text-decoration: underline;
	background: transparent;
	border: 1px solid transparent;
	font-family: var(--default-font);
}

.back-btn:active {
	box-shadow: none;
	-webkit-box-shadow: none;
}

.back-btn:focus {
	color: var(--default-primary-color);
	background-color: #FFFFFF;
	border-color: #FFFFFF;
}


.articlenumberright {
	font-family: var(--default-font);
	color: black;
/*	color: var(--default-primary-color);*/
	font-weight: bolder !important;
	font-size: 16px;
}

.articlename-oneproduct {
	color: var(--default-primary-color);
	text-transform: none !important;
	padding-bottom: 0;
}

.article-desc-short {
	margin-top: 20px;
	padding-left: 0 !important;
	font-size: 13px;
}



.quantity-oneproduct .form-control {
	padding: 0px 0px;
	padding-left: 5px;
	/*position: absolute;*/
	/*right: 43px;*/
	bottom: 59px;
	/*width: 106px;*/
	width: 100%;
	border-color: var(--default-primary-color);
}

	.quantity-oneproduct .form-control:focus {
		border-color: var(--default-primary-color);
		webkit-box-shadow: 0px 0px 5px 1px var(--default-primary-color);
		-moz-box-shadow: 0px 0px 5px 1px var(--default-primary-color);
		box-shadow: 0px 0px 5px 1px var(--default-primary-color);
	}

.quantity-oneproduct {
	border-radius: 4px;
	width: 100%;
	padding: 3px;
	max-width: 260px;
	margin: 0 0 0 0 !important;
}

.quantity-select {
	padding: 0 3px 0 0 !important;
	margin: 0 0 -20px 0 !important;
}

.quantity-showonly {
	margin-bottom: 20px !important;
}

.articlequantity-oneproduct {
	padding: 0px 10px !important;
}

.btn-single-buy {
	color: #FFFFFF;
	background-color: var(--default-primary-color);
	border: 1px solid var(--default-primary-color);
	font-size: 14px;
	line-height: 24px;
	height: 45px !important;
	padding: 0px 22px;
	float: left;
	clear: both;
	margin: 6px 3px;
	width: 170px !important;
}

	.btn-single-buy:hover, .btn-single-buy:active, .btn-single-buy:focus {
		color: #FFFFFF;
		background: var(--default-primary-color-hover);
		border: none !important;
	}

.btn-single-favourite {
	color: #FFFFFF;
	background-color: var(--default-secondary-color);
	font-size: 14px;
	line-height: 24px;
	height: 45px !important;
	padding: 0px 22px;
	margin: 6px 3px;
	width: 57px;
}

.btn-quotation {
	width: auto !important;
	margin-left: -1px;
}


.btn-single-favourite:hover, .btn-single-favourite:active, .btn-single-favourite:focus {
	color: #FFFFFF;
	background: #595959;
	border: none !important;
}

.btn-single-add {
	color: #FFFFFF;
	background-color: var(--default-primary-color);
	border: unset !important;
	font-size: 14px;
	line-height: 24px;
	height: 33px;
	padding: 0px 22px;
}

	.btn-single-add:hover, .btn-single-add:active, .btn-single-add:focus {
		color: #FFFFFF;
		background-color: var(--default-primary-color-hover);
		border: unset !important;
	}

.btn-single-create {
	color: #FFFFFF;
	background: var(--default-secondary-color);
	border: unset !important;
	height: 33px;
	font-size: 14px;
	line-height: 24px;
	padding: 0px 22px;
}

	.btn-single-create:hover, .btn-single-create:active, .btn-single-create:focus {
		color: #FFFFFF;
		background: #595959;
	}

.btn-print {
	width: fit-content !important;
	margin-left: 18px;
	border: none !important;
}

.btn-print span {
	padding-top: 3px;
}

.form-single-favouritelist {
	margin-top: 10px;
}

#CreateTemplatePopUp {
	margin-top: 20px;
	color: #FFFFFF;
	background: var(--default-primary-color);
	font-size: 14px;
	line-height: 24px;
	height: auto;
	padding: 6px 113px;
	border: unset !important;
}

	#CreateTemplatePopUp:hover {
		color: #FFFFFF;
		background: var(--default-primary-color-hover);
		border: unset !important;
	}

.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br {
	border-bottom-right-radius: 0px;
	border-bottom-left-radius: 0px;
	border-top-right-radius: 0px;
	border-top-left-radius: 0px;
}

.ui-widget {
	font-family: var(--default-font);
}

.ui-widget-content {
	border: 1px solid #aaaaaa;
	background: #ffffff;
	border-radius: 4px;
	background: rgba(255, 255, 255);
	color: #222222;
}

.ui-widget-content .form-control {
	border: 1px solid var(--default-primary-color);
}

.ui-widget-header {
	border: unset !important;
	background: transparent !important;
	color: black;
	font-weight: bold;
	font-family: var(--default-font);
	text-transform: uppercase;
}

.ui-widget button {
	font-family: Verdana,Arial,sans-serif;
	font-size: 1em;
}

.ui-dialog-titlebar-close {
	position: absolute;
	right: .3em;
	top: 25% !important;
	width: 20px;
	margin: -10px 0 0 0;
	padding: 1px;
	height: 20px;
	background: transparent;
	color: var(--default-secondary-color) !important;
	border: unset !important
}

.ui-dialog-titlebar-close:hover {
	background: unset !important;
}

.ui-dialog .ui-dialog-content {
	position: relative;
	border: 0;
	padding: .5em 1em;
	background: none;
	overflow: auto;
	text-transform: uppercase;
}

#templatename {
	font-family: var(--default-font);
	color: #000;
	padding: 2px 10px;
}

/*----STYLING FOR VARIANT VIEW----*/

.unit-select-variant {
	width: 90px !important;
}

.variant-buy {
	width: 199px !important;
}

.certificate-img {
	max-height: 100px;
	width: auto;
	margin: auto;
}

#Certificates {
	display: flex;
}


.certificates {
	display: flex;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

	.certificates > a {
		height: fit-content;
		margin: auto;
	}

.tooltip-inner {
	font-size: 16px;
}

/*---PRINT---*/

.images-print {
	display: none;
}

@media(max-width: 600px){
	.tab-lable{
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		max-width: 100px;
	}
}

@media (min-width: 500px){
	.actions-sub {
		width: 400px;
	}
}

@media print {
	#layout-before-main {
		display: none;
	}

	.zone-footer {
		display: none;
	}

	#backToTopBtn {
		display: none;
	}

	.actions {
		display: none;
	}

	.back-btn {
		display: none;
	}

	.articleImage {
		display: none !important;
	}

	#previewImageModal {
		display: none;
	}

	.images-print {
		display: block;
	}

	.print-img-big {
		width: 100%;
	}

	.print-img-small {
		width: 25%;
	}

	.articleInfo {
		width: 50% !important;
	}

	.articleEAV {
		display: none;
	}

	.related-products-wrapper {
		display: none;
	}

	#backToTopBtn {
		display: none
	}
}