@import "fonts/stylesheet.css";



body {
	font: 300 14px/18px Lato;
	background: #f4f4f4;
}

strong, b {font-weight: 700;}

h1 {
	width: 820px;
	padding: 0px 13px;
	margin: 27px auto 20px auto;
	font: 700 24px Roboto;
}
h1 span.logo {
	float: left;
	width: 102px;
	height: 36px;
	margin-top: 15px;
	margin-left: -160px;
}
h1 span.line {
	display: block;
	width: 846px;
	height: 5px;
	margin: 7px 0px 1px -13px;
	background: #d91b5c;
}
h1 span.ttl {
	font: 700 36px/37px Roboto;
	color: #f8236c;
}

h2 {
	width: 846px;
	margin: 0px auto;
	text-align: center;
	font: 700 30px/37px Roboto;
	color: #f8236c;
	background: url(../images/mini-logo.png) left 1px  no-repeat;
}
h2 b {
	color: #000;
}
h2:after {
	display: block;
	content: "";
	width: 846px;
	height: 5px;
	margin: 9px auto 0px auto;
	background: #d91b5c;
}

h2.style2 {
	color: #0093ff;
}
h2.style2:after {
	background: #0093ff;
}


nav,
#info,
#preim,
#prod,
#video,
#video-rek,
#catalogs,
#dillers,
#clinic,
#video-page,
#banner,
#icons,
#logos,
footer {
	width: 100%;
	float: left;
	clear: both;
}

.wrap-width {
	width: 100%;
	max-width: 1260px;
	margin: 0 auto;
}

.list {
	width: 100%;
	float: left;
	padding-bottom: 80px;
	background: #fff;
}



/* MENU */

nav.menu {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	box-sizing: border-box;
	height: 50px;
	padding: 7px 10px;
	background: #d91b5c;
	box-shadow: inset 0px 3px 3px 0px rgba(223,87,160,1), inset 0px 7px 4px 0px rgba(223,87,160,0.5),
	inset 0px -3px 3px 0px rgba(223,87,160,1), inset 0px -7px 4px 0px rgba(223,87,160,0.5),
	0 10px 10px rgba(0,0,0,0.15);
	z-index: 999;
}
nav.menu ul {
	width: 80%;
	float: left;
	overflow: hidden;
}
nav.menu ul li {
	float: left;
	border-left: solid 2px #b1003d;
}
nav.menu ul li a {
	display: block;
	margin: 0px 10px;
	font-size: 14px;
	font-weight: 400;
	line-height: 36px;
	color: #fff;
	text-transform: uppercase;
	text-decoration: none;
}
nav.menu ul li:first-child {margin-left: -2px;}
nav.menu ul li:first-child a {margin-left: 0px;}
nav.menu ul li a:hover {
	-moz-text-shadow:0 0 15px #fff, 0 0 5px rgba(255,255,255,0.3);
	-webkit-text-shadow:0 0 15px #fff, 0 0 5px rgba(255,255,255,0.3);
	text-shadow:0 0 15px #fff, 0 0 5px rgba(255,255,255,0.3);
}

.tel {
	width: 20%;
	float: right;
	text-align: right;
}
.tel a {
	color: #fff;
	font: 700 20px/34px Roboto;
	text-decoration: none;
}

a.menu-mob {
	display: none;
	float: left;
	margin: 10px 2%;
	margin-left: calc(2% + 10px);
	width: 47px;
	height: 42px;
	background: url(../images/menu-mob.png) center center no-repeat;
}



/* INFO */
#info {
	margin: 80px 0px;
	
}
#info .video-wrap {
	background: url(../images/info.jpg) top center no-repeat;
}
.video-in {
	float: none;
	position: relative;
	width: 820px;
	height: auto;
	margin: 0 auto;
	background: #000;
}
#info > .txt-wrap {
	width: 820px;
	margin: 30px auto;
}
#info > .txt-wrap p {
	margin-top: 10px;
	font: 400 13px/18px Roboto;
	text-indent: 10px;
}
#info > .txt-wrap p.podpis {
	margin-top: 0px;
	font: 700 24px Roboto;
	text-align: right;
}

/* PREIM */
#preim {
	margin: 25px 0px 80px 0px;
}
#preim ul {}
#preim ul li {
	float: left;
	width: 25%;
	text-align: center;
	color: #919191;
	font: 400 14px/18px Roboto;
}
#preim ul li img {
	max-width: 99%;
}
.polosa {
	float: left;
	width: 100%;
	margin-top: 14px;
	color: #fff;
	font: 400 24px/50px Roboto;
	background: #d91b5c;
	box-shadow: inset 0px 3px 3px 0px rgba(223,87,160,1), inset 0px 7px 4px 0px rgba(223,87,160,0.5),
	inset 0px -3px 3px 0px rgba(223,87,160,1), inset 0px -7px 4px 0px rgba(223,87,160,0.5);
	text-align: center;
}


/* CATALOGS */
#catalogs {
	margin: 25px 0px 80px 0px;
}
.catalog-wrap {
	display: flex;
	flex-wrap: wrap;
}
.catalog {
	width: 30%;
	margin: 20px auto;
	text-align: center;
}
.catalog-iframe {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 350px;
	background: #2e4b7a;
}
.catalog h3 {
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	height: 50px;
	background: #d91b5c;
	color: #fff;
	font: 400 24px/50px Roboto;
}
.catalog h3.h3min {
	font: 400 20px/25px Roboto;
}
.catalog p {
	background: #d91b5c;
	font: 400 20px/50px Roboto;
}
.catalog p:first-of-type {border-bottom: solid 1px #fff;}
.catalog p a {color: #fff;text-decoration: none;}
.catalog p a:hover {text-decoration: underline;}



/* PROD */
#prod {}
#prod .prod-wrap {
	float: none;
	max-width: 930px;
	margin: 48px auto 80px auto;
}
.products {
	display: flex;
	flex-wrap: wrap;
}
#prod .prod-item {
	position: relative;
	width: 299px;
	height: 343px;
	border: solid 2px #f4f4f4;
	overflow: hidden;
	margin: 0px auto 10px auto;
}
#prod .prod-tovar {
	float: left;
	width: 275px;
	height: 327px;
	padding: 8px 12px;
}
#prod h4 {
	float: left;
	width: 275px;
	height: 46px;
	
	color: #0093ff;
	font: 700 18px/22px Roboto;
}
#prod img {
	display: block;
	height: 170px;
	margin: 0px auto 5px auto;
}
#prod .prod-tovar p {
	float: left;
	width: 100%;
	height: 60px;
	font: 400 14px Roboto;
	color: #414141;
}
#prod .prod-tovar .prod-link {
	float: right;
	width: 121px;
	height: 48px;
	margin-right: -10px;
	background: url(../images/prod-torg.png) top left no-repeat;
}
#prod .prod-tovar .prod-link:hover {
	background: url(../images/prod-torg.png) bottom left no-repeat;
}
#prod .prod-text {
	position: absolute;
	width: 275px;
	height: 327px;
	padding: 8px 12px;
	top: 0px;
	left: 299px;
	background: #d91b5c;
}
#prod .prod-text p {
	font: 400 13px Roboto;
	color: #fff;
	text-indent: 10px;
	margin-bottom: 10px;
}
#prod .prod-link-back {
	position: absolute;
	width: 103px;
	height: 30px;
	bottom: 18px;
	right: 12px;
	background: url(../images/prod-torg-back.png) top left no-repeat;
}
#prod .prod-item:hover .prod-text {
}


/* CONTACTS */
#dillers {}
table.tab-diller {
	width: 700px;
	margin: 50px auto;
	border-collapse: collapse;
}
table.tab-diller td {
	padding: 10px 10px;
	border: solid 1px #2e4b7a;
	border-top: none;
}
table.tab-diller td:nth-child(1) {
	width: 130px;
	border-right: solid 1px #ccc;
}
table.tab-diller td:nth-child(2) {
	width: 130px;
	border-left: solid 1px #ccc;
	border-right: solid 1px #ccc;
}
table.tab-diller tr.tab-diller-ttl td {
	background: #d91b5c;
	color: #fff;
	border: solid 1px #d91b5c;
	font: 500 18px/22px Roboto;
}
table.tab-diller tr.tab-diller-th td {
	padding: 5px 10px;
	background: #2e4b7a;
	color: #fff;
}
table.tab-diller a {color: #2e4b7a;}
table.tab-diller a:hover {color: #d91b5c;}



/* VIDEO */
#video-page {margin: 30px auto;}
.video-page-wrap {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
.video-page-wrap h2 {
	background: none;
	margin: 80px auto 40px auto;
}
.video-item {
	width: 50%;
	padding: 20px;
	box-sizing: border-box;
}
.video-item h3 {
	margin-bottom: 20px;
	text-align: center;
	font: 700 18px/24px Roboto;
	color: #919191;
}
.video-item  video {
	width: 100%;
	float: left;
	clear: both;
}




/* VIDEO GALLERY */
.video-rek-wrap {
	max-width: 935px;
	height: auto;
	margin: 40px auto;
}
.video-rek-item video {
	width: 100%;
	float: left;
	clear: both;
	margin: 40px 0px;
}
a.video-link {
	display: block;
	width: 250px;
	margin: 0 auto;
	font: 500 18px/32px Roboto;
	color: #2e4b7a;
}
a.video-link:hover {color: #d91b5c;}
a.video-link img {
	float: left;
	margin-right: 20px;
}

#sync2 {
	max-width: 735px;
	margin: 0 auto;
	background: url(../images/video-nav.png) center 250px no-repeat;
}
#sync2 .item {
	width: 100%;
	max-width: 305px;
	cursor: pointer;
	margin: 0 auto;
}
#sync2 .item h3 {
	display: block;
	width: calc(100% - 20px);
	height: 39px;
	padding: 0px 10px;
	background: #0093ff;
	font: 600 15px/39px Roboto;
	text-align: center;
}
#sync2 img {
	max-width: 305px;
	height: auto;
	border: none;
}

#sync1 {
	width: 935px;
	height: auto;
	margin: 0 auto;
}

#sync1 h4 {
	margin-top: 35px;
	font: 700 43px Roboto;
	color: #919191;
	text-align: center;
}





/* CLINIC */
#clinic {
	padding: 30px 0px;
}
.clinic-wrap {
	margin: 40px auto 120px auto;
}



/* BANNER */
#banner {margin: 40px 0px}
#banner img {max-width: 100%}


/* ICONS */
#icons {margin: 80px 0px 110px 0px}

#icons ul {
	width: 945px;
	margin: 0 auto;
}
#icons ul li {
	float: left;
	width: 33%;
	text-align: center;
}
#icons ul li h4{
	height: 45px;
	margin-top: 48px;
	color: #d91b5c;
	font: 700 18px/22px Roboto;
}
#icons ul li p {
	margin: 8px 15px;
	color: #000;
	font: 300 13px/18px Roboto;
}


/* LOGOS */
#logos {margin: 40px 0px}
.logos-wrap {
	width: calc(96% - 114px);
	max-width: 710px;
	height: 98px;
	margin: 40px auto 120px auto;
}
.logos-item {
	width: 176px;
	height: 176px;
	margin: 0 auto;
}
.logos-item img {
	width: 168px;
	height: 94px;
	padding: 2px;
	border: solid 2px #fff;
}
.logos-item h3 {
	display: none;
	margin-top: 6px;
	font: 700 16px/22px Roboto;
	color: #0093ff;
	text-align: center;
}
.logos-item h3 span {
	display: block;
	font-size: 12px;
	color: #919191;
}
.logos-item:hover img {
	border: solid 2px #0093ff;
}
.logos-item:hover h3 {
	display: block;
}


/* FOOTER */
footer {
	
	background: #2e4b7a;
}

.social {
	float: left;
	width: 105px;
	padding: 20px 2%;
}
.social span.logo {
	float: left;
	width: 102px;
	height: 36px;
	margin-top: 15px;
}
.social a {
	float: left;
	width: 55px;
	height: 55px;
	background-image: url(../images/soc.png);
	background-position-y: top;
	text-decoration: none;
}
.social a.vk {background-position-x: left;}
.social a.fb {background-position-x: center;}
.social a.inst {background-position-x: right;}
.social a:hover {
	background-position-y: bottom;
}

.contact {
	float: left;
	padding-top: 13px;
	font: 700 18px Roboto;
	color: #0093ff;
}
.contact p {
	margin-top: 5px;
	font: 400 12px/18px Lato;
	color: #fff;
}
.contact p.copy {
	margin-top: 15px;
	font: 500 14px Roboto;
	color: #fff;
}
.contact a {
	font: 400 14px/22px Lato;
	color: #fff;
	text-decoration: none;
}
.contact a:hover {text-decoration: underline;}


.scrollup {
	display: none;
	position: fixed;
	width: 50px;
	height: 50px;
	right: 20px;
	bottom: 20px;
	background: rgba(255,255,255,0.8);
	border: solid 1px #d91b5c;
	border-radius: 30px;
	font: 700 35px/45px 'Segoe UI';
	color: #d91b5c;
	text-decoration: none;
	text-align: center;
}
.scrollup:hover {
	background: #d91b5c;
	border: solid 1px #d91b5c;
	color: #fff;
}