@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700&subset=cyrillic-ext');

* {border: 0; margin: 0; padding: 0; box-sizing: border-box;}
a {text-decoration: none;}

html { position: absolute; width: 100%; height: auto; min-height: 100%; margin: 0px; padding: 0px; top: 0; left: 0;}
body {font-family: 'Open Sans', sans-serif; font-weight: 400; color:#222; overflow-x: hidden; background-color: #fff;}

.everw {background-color: #fff;}
.all {white-space: nowrap;}

.fix-top-main {margin-top: 85px;}
.fix-top {margin-top: 135px;}

.hide1 {display: block;}
.hide2 {display: none;}
#uland {display: none;}
label[for='uland'] {display: none;
}

.gap:before {display: block; content: ""; height: 50px;	margin: -50px 0 0 0;}
.gap1:before {display: block; content: ""; height: 135px; margin: -135px 0 0 0;}
.gap2:before {display: block; content: ""; height: 85px; margin-top: -85px;}

/*  --- Main menu script class --- */
.cd-auto-hide-header {box-shadow: 0 1px 5px 0px rgba(0,0,0,0.2); position: fixed; z-index: 20; top: 0; left: 0;	width: 100%; height: 85px; background-color: #fff;
  /* Force Hardware Acceleration */
  -webkit-transform: translateZ(0);transform: translateZ(0);will-change: transform; -webkit-transition: -webkit-transform .5s;
  transition: -webkit-transform .5s; transition: transform .5s; transition: transform .5s, -webkit-transform .5s;
}

/*  ---  .cd-auto-hide-header::after {clear: both; content: ""; display: block;} --- */

.cd-auto-hide-header.is-hidden { -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%);transform: translateY(-100%);}
.cd-secondary-nav {box-shadow: 0 1px 5px 0px rgba(0,0,0,0.2); width: 100%; background-color: #383838;
  /* Force Hardware Acceleration */ -webkit-transform: translateZ(0);transform: translateZ(0); will-change: transform;-webkit-transition: -webkit-transform .5s;
  transition: -webkit-transform .5s; transition: transform .5s;transition: transform .5s, -webkit-transform .5s;}
/*  --- END  Main menu script class --- */

/*  ---  Main menu  --- */
header {height: 85px; display: flex; max-width: 1300px; margin: 0px auto;}
.logo {position: relative; margin: 19px 0 0 32px; background: url(img/intermech_logo_line_rgb2.svg) top left/165px 32px no-repeat; min-width: 165px;}
header .logo a {position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; z-index: 1;}
.logo-text {font-weight: 600; font-size: 11px; text-transform: uppercase; padding: 39px 10px 0 10px;}
nav {margin-left: auto;}
.menu-nav {display: flex; list-style: none;}
nav ul li {display: flex; height: 85px; white-space: nowrap; font-weight: 600; font-size: 13px;}
nav a {color:#222;}
nav ul li a {padding: 37px 8px 0 8px; width: 100%;}
nav ul li a:hover {color: #1892f9;}
a.now-nav { color: #1892f9; border-bottom: 2px solid #333; margin-bottom: 12px;}
.search {padding: 36px 15px 0 14px; cursor: pointer;}
.link {cursor: pointer;}
.menu-btn {display: none;}
/*  --- END  Main menu  --- */


/* ----  Search Form  ----   */
input {outline: 0 !important;} 
#wrap {position: relative; width: 50px; margin: 0px; padding: 0;}
.icon {fill: #555;}
#wrap:hover .icon {fill: #1892f9;}
/* ----  END  Search Form  ----   */

/*  ---  Menu product  ---  */
.flex {display: flex; position: relative; max-width: 1300px; margin: 0px auto; justify-content: center; flex-direction: column;}
.flexs {display: flex; position: relative; max-width: 1300px; margin: 0px auto; height: 100%;}

.product_name {display: inline-flex; justify-content: center; align-items: center; padding: 0 4px 0 35px;
		font-weight: 400; font-size:16px; color: #fff; letter-spacing: 1px; text-transform: none;}
.product_name ~ span:before {display: block; padding: 0 5px; font-size: 30px; font-weight: 300; content: '\203a'; transform: translate(0px, 1px); color: #fff;}
.name, .box-menu {display: none; min-width: 80px;}
.menu-product {display: inline-flex; flex-direction: row; list-style: none; flex-grow: 1;}
.menu-product li {display: flex; font-size: 13px; font-weight: 400; letter-spacing: 1px; text-align: center;}
.menu-product a {display: flex; padding: 0 15px; color: #fff; height: 50px; align-items: center; justify-content: center;}
.menu-product a[class=now] {background-color: #1892f9; color: #fff;}
.menu-product a:hover {background-color: #656565;}
.old a[class=now] {background-color: #16a599;}
.old a {color: #fff;}
.old a:hover {background-color: #656565; color: #fff;}
/*  ---  END  Menu product  ---  */

.container {display: flex; flex-wrap: wrap; max-width: 1300px; margin: 0px auto; justify-content: space-between;}
.container1 {display: flex; flex-wrap: wrap; max-width: 1300px; margin: 0px auto;}
.rama {padding: 0px 35px;}
.rama1 {padding: 0 20px;}

.one-half {display: flex; width: 50%; flex-grow: 1; flex-wrap: wrap;}
.one-half1 {display: flex; width: 47%; flex:  0 1 47%; flex-wrap: wrap;}

.title {text-align: center; padding: 25px 15px; width: 100%;}
.title h1 {font-size: 32px; font-weight: 400; line-height: normal;}
h2 {font-size: 24px; font-weight: 600; color: #474747; margin: 30px 10px 0 0px; flex: 1 0 100%;}
h3 {text-transform: uppercase; font-size: 17px; font-weight: 700; padding: 10px 0 12px 0;}
h4 {font-size: 15px; font-weight: 600;}
h5 {font-size: 20px; font-weight: 600; color: #444; padding: 0 0 6px 0; margin-bottom: 5px;}
.border-short-bottom h1,
.border-short-bottom h2,
.border-short-bottom h3,
.border-short-bottom h4,
.border-short-bottom h5,
.border-short-bottom h6 {position: relative; margin: 0 0 10px 0; padding: 0 0 25px 0;}

.border-short-bottom h1:before, .border-short-bottom h2:before {position: absolute; bottom: -1px; left: 50%; width: 200px; height: 1px; margin-left: -100px; content: ""; background: #aaa;}
.border-short-bottom h1:after, .border-short-bottom h2:after {position: absolute; bottom: -5px; left: 50%; border-radius: 50%; border: 1px solid #959595; width: 7px; height: 7px; margin-left: -5px; content: ""; background: #fff;}

.modul {flex-grow: 1; font-size: 16px; line-height: 26px; color: #333;}
.modul p {margin: 0 0 20px 0;}
.modul ul {margin: 0 0 0 20px;}
.modul ul li {padding: 0 0 12px 0;}

.border {background-color: #f4f4f4; border: 2px solid #ddd; font-size: 15px; padding: 20px 40px 30px 40px; margin: 10px 15px;}
.underline {padding: 2px 0px; border-bottom: 1px dashed #888; color: inherit;}
.underline:hover {color: #fff; background-color: #888; border-bottom: none;}

.dark_container {flex: 1 1 100%; color: #fff; text-align: center; align-self: center;}
.dark_container h1.work {font-weight: 600; font-size: 46px; line-height: 54px; margin: 0 10px 25px 10px;}
.dark_container h1.price_page {font-weight: 400; font-size: 47px; line-height: 63px; margin: 0px 30px 20px 30px;}
.dark_container h1 {line-height: 55px;}
.dark_container h1 span {display: block;font-weight: 400; font-size: 16px; line-height: 26px;  color: inherit;}
.dark_container h2 {font-weight: 400; font-size: 27px; margin: 0px 30px 30px 30px; color: inherit;}
.dark_container p {font-size: 16px; margin: 0px 30px 22px 30px; line-height: 25px;}

/* ---- Buttons  ----   */
.btn {display: inline-block; font-family: 'Open Sans', sans-serif; font-weight: 400;  font-size: 13px;
	margin: 20px 0 10px 0; padding: 5px 15px 6px 15px; border-radius: 15px; box-shadow: 1px 3px 5px -2px rgba(0,0,0,0.3);
}
.btn-black-line {background-color: #fff; border: 1px solid #555; color: #000;}
.btn-black-line:hover {background-color: #222; border: 1px solid #555; color: #fff;}
.btn-white-line {background-color: #222; border: 1px solid #999; color: #fff;}
.btn-flash {background-color: #1892f9; color: #fff; border: 1px solid #1589f8;}
.btn-red-line {background-color: #16a599; border: 1px solid #16a599; color: #fff;}
.btn-white-line:hover, .btn-flash:hover, .btn-red-line:hover {border: 1px solid #999; background-color: #fff; color: #333;}
.red_line {padding: 2px 12px; border-radius: 12px; font-size: 95%; background-color: #1892f9; color: #fff; border-bottom: 1px solid #258ce4;}
.red_line_old {padding: 2px 12px; margin: 0 2px 0 0; border-radius: 12px; font-size: 95%; background-color: #16a599; color: #fff; border-bottom: 1px solid #16a599;}
.red_line:hover, .red_line_old:hover {background-color: #888; border-bottom: 1px solid #888;}

#toTop {position:fixed; cursor:pointer; display:none; bottom:20px; right:20px; transform: rotate(90deg);	text-align:center; font-size:30px; line-height: 39px;
	height: 50px; width: 50px; border-radius: 10px; border: 2px solid #999;	background:rgba(0, 0, 0, 0.6); color:#fff;}
/* ---- END Buttons  ----   */

.btn-line {display: inline-block;border: 1px solid #555; color: #555;border-radius: 15px;font-size: 13px;font-weight: 700;
margin: 12px 0 12px 0; padding: 3px 20px 4px 20px;}
.btn-line:hover {background-color: #888; color: #f3f3f3;border: 1px solid #888;}

#cookies_policy	{display:none; position:fixed; z-index:10000000;border-radius: 10px; border: 2px solid #999; background:rgba(0, 0, 0, 0.7); color:#fff;
box-shadow: 2px 3px 10px rgba(0, 0, 0, 0.4); vertical-align:middle;	max-width:423px; padding:30px 25px 20px 25px; width:100%; bottom:20px; left:20px;
}

#cookies_policy .text-container	{font-size:14px;line-height: 20px; text-align:left;}


/* Footer */

footer {font-weight: 400; font-size: 13px; color:#333; padding: 1px 0; border-top: 1px solid #ddd; background-color: #f3f3f3;}
.rama-footer {padding: 30px 35px;}
.rama-small {padding: 20px 0 0 0;}

.policy {padding: 7px 40px 15px 0;}
.soc {padding: 5px 10px 0 0;}
.soc:hover svg path {fill:#888;}


.btn-foot {display: inline-block; font-family: 'Open Sans', sans-serif; font-weight: 400;  font-size: 13px;
	margin: 0 0 0 1px; padding: 2px 13px 3px 14px; border-radius: 15px; background-color: #1892f9; color: #fff; border: 1px solid #1589f8;}
.btn-foot:hover {border: 1px solid #999; background-color: #888; color: #f3f3f3;}

.first {display: flex; width: 67%;  flex-wrap: wrap; align-items: flex-start; padding: 0 0 10px 0;}
.second {display: flex; width: 33%;  flex-wrap: wrap; align-items: flex-start;padding: 0 0 20px 0;}

.for1 {width: 48%; padding: 0 30px 0 0;}
.for2 {width: 52%; padding: 0 30px 0 0;}
.for3 {width: 68%; padding: 0 30px 0 0;}
.for4 {width: 32%; padding: 0;}
footer h4 {font-weight: 700; font-size: 13px; margin: 0; padding: 7px 0 5px 0;}
footer p {width: 100%;line-height: 25px;}
footer ul {list-style: none; width: 100%;}
footer ul li { padding: 6px 0; font-size: 13px;}
footer a {color:#222;}
footer a:hover {color: #1892f9;}
.move2 {display: none;}
/* Footer */


@media screen and (max-width: 1280px) {

nav ul li a {padding: 37px 6px 0 6px;}
}


@media screen and (max-width: 1180px) {
.for1 {width: 50%; padding: 0 25px 0 0;}
.for2 {width: 50%; padding: 0 25px 0 0;}
}

@media screen and (max-width: 1120px) {
.logo-text {display: none;}
}
@media screen and (max-width: 1100px) {
.for1 {width: 55%;  padding: 0 20px 0 0; }
.for2 {width: 45%;}
}

@media screen and (max-width: 960px) {
.one-half {width: 100%;}
.hide2 {display: block;}
.hide1 {display: none;}
nav ul li a {padding: 37px 4px 0 4px;}
h2 {font-size: 25px; font-weight: 600; color: #474747;}
}

@media screen and (max-width: 915px) {
.rama-footer {padding: 20px 35px;}
.first {width: 100%; border-bottom: 1px solid #bbb; padding: 0 0 15px 0;}
.second {width: 100%; padding: 7px 0 20px 0;}
.for1, .for3 {width: 55%;}
.for2, .for4 {width: 45%;}


.fix-top-main {margin-top: 85px;}
.logo-text {display: block;}
	
/* Button */
.menu-btn {margin-top: 30px; border-radius:50%; display: block; position: relative; width: 30px; height: 30px; background-color: #fff;}
.menu-btn span, .menu-btn span::before, .menu-btn span::after {position: absolute; top: 50%; left: 50%; margin-top: -1px; margin-left: -10px; width: 20px; height: 2px; background-color: #222;}
.menu-btn span::before, .menu-btn span::after {content: ''; display: block; transition: 0.2s;}
.menu-btn span::before {transform: translateY(-5px);}
.menu-btn span::after {transform: translateY(5px);}
.menu-btn_active {transform: rotate(45deg);}
.menu-btn_active span:before {transform: rotate(180deg);}
.menu-btn_active span:after {transform:  rotate(90deg);}
.menu-btn_active span {height: 0;}
/* Button */

.menu-nav {flex-direction: column; max-height: calc(100vh - 85px); overflow: auto; position: absolute; top: 100%; left:100%;
	 width: 100%; padding: 0; text-align: left; background : #fff; transition: 0.6s; z-index: 150;}
.menu-nav_active {left: 50%;}
nav ul li {flex: 1 1 40px; height: auto;}
a.now-nav {color: #1892f9; border-bottom: 1px solid #ccc; margin-bottom: 0px;}
nav ul li a {padding:12px 0 12px 50px; border-bottom: 1px solid #ccc;}
nav ul li a:hover {background-color: #999; color: #fff;}
}

@media screen and (max-width: 850px) {
.menu-product a {padding: 0 8px;}
.menu-product a[class=now] {padding: 0 8px;}

.dark_container h1.work {font-weight: 600; font-size:38px; line-height: 40px;}
.dark_container h1.price_page {margin: 0px 10px 20px 10px; font-size: 38px; line-height: 55px;}

.dark_container h2 {font-size: 22px; margin: 0px 10px 30px 10px;}
.dark_container p { font-weight: 400; font-size: 15px; line-height: 25px;}

#toTop {display:none; bottom:10px; right:10px; height: 40px; width: 40px; border-radius: 20px; font-size:27px; line-height: 31px; }

.one-half1 {width: 100%; flex: 1 1 auto;}
.modul {font-size: 15px;}
}

@media screen and (max-width: 700px) {
.fix-top {margin-top: 125px;}

/*  .menu-product  _______________________________________________________*/
input[type=checkbox]:checked ~ span {display: none;}
.product_name ~ span {display: none;}
.box-menu {display: flex; align-items: center; font-size:15px; font-weight: 400; color: #fff; cursor: pointer; padding: 0 10px 0 22px; height: 40px;}
.menu-product {width: 300px; top:100%; position: absolute; background-color: #ececec; transition: 0.6s;	flex-direction: column; list-style: none; left: 0;}
.menu-product a {justify-content: flex-start; flex: 1 0 auto; padding: 0 35px; color: #333; font-weight: 600; border-bottom: 1px solid #999;}
.menu-product a[class=now] {padding: 17px 10px 13px 35px;}
.menu-product a:hover {background-color: #999;}
input[type=checkbox]:checked  ~ .menu-product {left:-100%; position: absolute;}
input[type=checkbox]:checked ~ label:before {display: inline-block; font-size: 30px; content: '\203a'; font-weight: 300; transform: translate(-14px, -3px) rotate(0deg);}
input[type=checkbox] ~ label:before {display: inline-block; font-size: 30px; content: '\203a'; font-weight: 300; transform: translate(-9px, 0px) rotate(90deg); transition: 0.2s;}
input[type=checkbox]  ~ .menu-product {left: 0;}
.old a[class=now] {border-bottom: 1px solid #16a599; border-top: 0px solid #16a599; padding: 15px 15px 15px 25px; box-sizing:border-box; color: #fff; font-weight: 600; background-color: #16a599;}
/*  end of .menu-product  _______________________________________________________*/

.hide_logo {display: none;}
.gap:before {display: block; content: ""; height: 40px;	margin: -40px 0 0 0;}
}

@media screen and (max-width: 650px) {
.for2 ul li {display: none;}
.for3 ul li {display: none;}
.for4 ul li {display: none;}
h4.mob-hide {display: none;}

.for1 {width: 100%; padding: 0;}

.for3 {width: 65%; padding: 0 30px 0 0;}
.for4 {width: 35%; padding: 0px;}
.rama-small {padding: 10px 0 0 0;}
.move2 {display: block;}
.move1 {display: none;}
}

@media screen and (max-width: 550px) {
h2 {font-size: 22px; font-weight: 600;}
.btn {margin: 10px 0px;}
}

@media screen and (max-width: 500px) {
.rama {padding: 0 20px;}
.border {padding: 15px 25px;}
.fix-top-main {margin-top: 45px;}
.fix-top {margin-top: 85px;}
.cd-auto-hide-header {height: 45px;}
.menu-nav  { max-height: calc(100vh - 45px);}
.box-menu {height: 40px;}
.product_name {padding: 0 0 0 20px;}
.product_name ~ span:before { padding: 0 5px ; transform: translate(0px, 0px);}
.menu-product a {padding: 0 20px;}
.menu-product a[class=now] {padding: 17px 10px 13px 20px;}

.logo-text {display: none;}
.logo {position: relative; margin: 7px 0 0 20px; background: url(img/intermech_logo_line_rgb2.svg) top left/140px 27px no-repeat; min-width: 148px;}
header {height: 45px;}

.menu-btn {margin-top:10px;}
.search {padding: 15px;}
.rama1 {padding: 0 5px;}
.rama-footer {padding: 20px;}

.dark_container h1.work {font-weight: 600; font-size:32px; line-height: 38px; margin: 0 10px 15px 10px;}
.dark_container h1.price_page { margin: 5px 10px 10px 10px; font-size: 29px; line-height: 35px;}

.dark_container h2 {font-size: 19px; margin: 10px;}
.dark_container p { font-weight: 400; font-size: 14px; line-height: 23px; margin: 15px 20px;}

#cookies_policy	{ padding:30px 25px 20px 25px; max-width:100%; bottom:40px; left:0px;}
}

@media screen and (max-width: 400px) {
.border {padding: 15px 5px 15px 15px; margin: 10px 5px;}
.box-menu {font-size:14px; font-weight: 400; padding: 0 10px 0 22px;}
.dark_container h1 {line-height: 45px;}
.for3 {width: 100%; padding: 0;}
.for4 {width: 100%; padding: 0;}

@media screen and (max-width: 340px) {
p {font-size: 14px;}
footer p {font-size: 13px;}
.product_name {font-size: 15px;}
.sol {display: none;}
.rama-footer {padding: 20px 20px 0 20px;}
.btn-foot {margin: 10px 0 0 1px;}
}