/*

-- Watson-Energo
template: product

Powered by Lemur Digital
hello@lemur.digital
https://lemur.digital

*/

.screen1 {
	padding: 33px 0 145px 0;
	background: #f1f1f1;
}

@media all and (max-width: 894px) {
	.screen1 {
		padding: 26px 0 116px 0;
	}
}

.screen1 .back {
	width: 100%;
	max-width: 945px;
	margin-bottom: 87px;
}

@media all and (max-width: 894px) {
	.screen1 .back {
		margin-bottom: 70px;
	}
}

.screen1 .back a {
	color: #00543d;
}

.screen1 .back a:hover {
	color: #e10020;
}

.screen1 .back a span {
	display: inline-block;
	position: relative;
	width: 0;
	height: 16px;
	margin: 0 10px 0 0;
	top: 4px;
}

.screen1 .back a span:before,
.screen1 .back a span:after {
	content: '';
	display: block;
	width: 5px;
	height: 1px;
	background: #00543d;
	position: absolute;
	left: 0;
	-webkit-transition: all ease-out 0.2s;
	-moz-transition:    all ease-out 0.2s;
	-o-transition:      all ease-out 0.2s;
	transition:         all ease-out 0.2s;
}

.screen1 .back a:hover span:before,
.screen1 .back a:hover span:after {
	background: #e10020;
}

.screen1 .back a span:before {
	top: 6px;
	-moz-transform: 	rotate(-45deg);
	-ms-transform: 		rotate(-45deg);
	-webkit-transform: 	rotate(-45deg);
	-o-transform: 		rotate(-45deg);
	transform: 			rotate(-45deg);
}

.screen1 .back a span:after {
	top: 9px;
	-moz-transform: 	rotate(45deg);
	-ms-transform: 		rotate(45deg);
	-webkit-transform: 	rotate(45deg);
	-o-transform: 		rotate(45deg);
	transform: 			rotate(45deg);
}

.screen1 .flex-bloc {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-start;
}

.screen1 .flex-bloc .images {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	padding-bottom: 96px;
}

@media all and (min-width: 1200px) {
	.screen1 .flex-bloc .images {
		max-width: 550px;
		position: sticky;
		top: 139px;
	}
}

@media all and (min-width: 895px) and (max-width: 1199px) {
	.screen1 .flex-bloc .images {
		padding-bottom: 60px;
		height: 610px;
	}
}

@media all and (max-width: 894px) {
	.screen1 .flex-bloc .images {
		padding-bottom: 40px;
	}
}

.screen1 .flex-bloc .images input {
	display: none;
}

.screen1 .flex-bloc .images .preview {
	width: 80px;
	height: 100%;
	position: relative;
	margin-right: 15px;
}

@media all and (max-width: 1199px) {
	.screen1 .flex-bloc .images .preview {
		width: -webkit-calc(100% - 56px);
		width:      -o-calc(100% - 56px);
		width:         calc(100% - 56px);
		max-width: 455px;
		height: 80px;
		margin-right: 0;
		margin-top: 15px;
		order: 2;
	}
}

@media all and (min-width: 1200px) {
	.screen1 .flex-bloc .images .preview .lr-slide-prev,
	.screen1 .flex-bloc .images .preview .lr-slide-next {
		position: absolute;
		left: 20px;
		width: 40px;
		height: 13px;
		cursor: pointer;
	}
}

@media all and (max-width: 1199px) {
	.screen1 .flex-bloc .images .preview .lr-slide-prev,
	.screen1 .flex-bloc .images .preview .lr-slide-next {
		position: absolute;
		top: 20px;
		width: 13px;
		height: 40px;
		cursor: pointer;
	}
}

@media all and (min-width: 1200px) {
	.screen1 .flex-bloc .images .preview .lr-slide-prev {
		top: -28px;
	}
}

@media all and (max-width: 1199px) {
	.screen1 .flex-bloc .images .preview .lr-slide-prev {
		left: -28px;
	}
}

@media all and (min-width: 1200px) {
	.screen1 .flex-bloc .images .preview .lr-slide-prev svg {
		position: absolute;
		top: -13px;
		left: 13px;
		-moz-transform: 		rotate(90deg);
		-ms-transform: 			rotate(90deg);
		-webkit-transform: 	rotate(90deg);
		-o-transform: 			rotate(90deg);
		transform: 					rotate(90deg);
	}
}

@media all and (min-width: 1200px) {
	.screen1 .flex-bloc .images .preview .lr-slide-next {
		bottom: -28px;
	}
}

@media all and (max-width: 1199px) {
	.screen1 .flex-bloc .images .preview .lr-slide-next {
		right: -28px;
	}
}

@media all and (min-width: 1200px) {
	.screen1 .flex-bloc .images .preview .lr-slide-next svg {
		position: absolute;
		bottom: -13px;
		left: 13px;
		-moz-transform: 		rotate(90deg);
		-ms-transform: 			rotate(90deg);
		-webkit-transform: 	rotate(90deg);
		-o-transform: 			rotate(90deg);
		transform: 					rotate(90deg);
	}
}

@media all and (min-width: 1200px) {
	.screen1 .flex-bloc .images .preview .slick-list {
		width: 100%;
		height: 100%;
		overflow: hidden;
		max-height: 340px;
	}
}

@media all and (max-width: 1199px) {
	.screen1 .flex-bloc .images .preview .slick-list {
		width: 100%;
		height: 100%;
		overflow: hidden;
		max-width: 455px;
	}
}

.screen1 .flex-bloc .images .preview svg {
	width: 13px;
	height: 40px;
}

.screen1 .flex-bloc .images .preview .img {
	display: block;
	width: 80px;
	height: 60px;
	margin-bottom: 10px;
	cursor: pointer;
	box-sizing: border-box;
	border: 1px solid #dbdbdb;
	outline: none;
}

@media all and (max-width: 1199px) {
	.screen1 .flex-bloc .images .preview .img {
		width: 60px;
		height: 80px;
		margin-bottom: 0;
		margin-right: 10px;
	}
}

.screen1 .flex-bloc .images .preview .img.slick-current {
	border: 1px solid #406557;
}

.screen1 .flex-bloc .images .preview .img:last-child {
	margin-bottom: 0;
}

@media all and (max-width: 1199px) {
	.screen1 .flex-bloc .images .preview .img:last-child {
		margin-right: 0;
	}
}

.screen1 .flex-bloc .images .image {
	width: 455px;
	height: 340px;
	overflow: hidden;
	box-sizing: border-box;
	border: 1px solid #dbdbdb;
}

@media all and (max-width: 1199px) {
	.screen1 .flex-bloc .images .image {
		width: -webkit-calc(100%);
		width:      -o-calc(100%);
		width:         calc(100%);
		height: 300px;
		order: 1;
		max-width: 455px;
	}
}

.screen1 .flex-bloc .images .image .bloc {
	width: 100%;
	height: 340px;
	display: flex;
	justify-content: center;
	align-items: center;
	background: #fff;
	box-sizing: border-box;
	padding: 25px;
}

@media all and (max-width: 1199px) {
	.screen1 .flex-bloc .images .image .bloc {
		height: 300px;
		padding: 15px;
	}
}

.screen1 .flex-bloc .images .image .bloc img {
	max-width: 100%;
	max-height: 100%;
}

.screen1 .flex-bloc .images .image .img.lrwb-modal-btn {
	cursor: pointer;
}

.screen1 .flex-bloc .des {
	width: 100%;
	max-width: -webkit-calc(100% - 580px);
	max-width:      -o-calc(100% - 580px);
	max-width:         calc(100% - 580px);
	margin-left: 30px;
	color: #43423e;
}

@media all and (max-width: 1199px) {
	.screen1 .flex-bloc .des {
		max-width: 750px;
		margin-left: 0;
	}
}

.screen1 .flex-bloc .des span,
.screen1 .flex-bloc .des b {
	white-space: nowrap;
}

.screen1 .flex-bloc .des p {
	font-size: 16px;
	line-height: 24px;
	letter-spacing: 0;
	font-weight: 400;
	margin-top: 40px;
}

.screen1 .flex-bloc .des p.vendor {
	margin-top: 0;
}

.screen1 .flex-bloc .des p.zag {
	font-weight: 500;
	margin-top: 40px;
	text-align: left;
	width: 100%;
}

.screen1 .flex-bloc .des p.zag + p {
	margin-top: 0px;
}

.screen1 .flex-bloc .des p + ul {
	margin-top: 0px;
}

.screen1 .flex-bloc .des .table-scroll {
	width: 100%;
	overflow-x: scroll;
}

.screen1 .flex-bloc .des table {
	width: 100%;
	border: 1px solid #dbdbdb;
	border-collapse: collapse;
	box-sizing: border-box;
	background: #fff;
}

.screen1 .flex-bloc .des table span {
	word-wrap: normal;
}

.screen1 .flex-bloc .des p.zag + table {
	margin-top: 6px;
}

.screen1 .flex-bloc .des table td {
	border-top: 1px solid #dbdbdb;
	border-right: 1px solid #dbdbdb;
	padding: 10px 15px;
	text-align: center;
}

.screen1 .flex-bloc .des table td:last-child {
	border-right: 0;
}

.screen1 .flex-bloc .des table th {
	font-weight: 500;
	border-right: 1px solid #dbdbdb;
	padding: 10px 15px;
	text-align: center;
}

.screen1 .flex-bloc .des table b {
	font-weight: 500;
}

.screen1 .flex-bloc .des table th:last-child {
	border-right: 0;
}

.screen1 .flex-bloc .des table + p {
	margin-top: 40px;
}

.screen1 .flex-bloc .des .des-images {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: center;
	margin: 0 auto;
	margin-top: 40px;
}

@media all and (max-width: 618px) {
	.screen1 .flex-bloc .des .des-images {
		max-width: 279.5px;
	}
}

.screen1 .flex-bloc .des .des-images a {
	display: block;
	width: 279.5px;
	height: 400px;
	margin: 15px;
}

@media all and (min-width: 619px) {
	.screen1 .flex-bloc .des .des-images a:nth-child(-n+2) {
		margin-top: 0;
	}

	.screen1 .flex-bloc .des .des-images a:nth-child(2n) {
		margin-right: 0;
	}

	.screen1 .flex-bloc .des .des-images a:nth-child(2n+1) {
		margin-left: 0;
	}

	.screen1 .flex-bloc .des .des-images a:nth-last-child(-n+1) {
		margin-bottom: 0;
	}
}

@media all and (max-width: 618px) {
	.screen1 .flex-bloc .des .des-images a {
		margin: 15px 0;
	}

	.screen1 .flex-bloc .des .des-images a:first-child {
		margin-top: 0;
	}

	.screen1 .flex-bloc .des .des-images a:last-child {
		margin-bottom: 0;
	}
}

.screen1 .flex-bloc .des ul {
	margin-top: 40px;
}

.screen1 .flex-bloc .des ul li {
	padding-left: 15px;
	position: relative;
}

.screen1 .flex-bloc .des ul li:before {
	content: '';
	display: block;
	position: absolute;
	top: 8px;
	left: 0px;
	width: 4px;
	height: 4px;
	background-color: #434343;
	border-radius: 100%;
}

.screen1 .flex-bloc .des .btn:last-child {
	margin-top: 40px;
}

@media all and (max-width: 1199px) {
	.screen1 .flex-bloc .des .btn:last-child {
		margin: 0 auto;
		margin-top: 40px;
	}
}

.cta2 h2 {
	max-width: -webkit-calc(100% - 295px);
  max-width:      -o-calc(100% - 295px);
  max-width:         calc(100% - 295px);
  margin-right: 100px;
}

.cta2 .btn {
	min-width: 240px;
}
