
/*--------- DEFAULT ---------------------------------------------------------------------------------------------------------------------------------------*/

 html { height: 100%; }

 html * {max-height:1000000px;}

 body
	{
	position: relative;
	min-height: 100%;
	padding: 0;
	margin: 0;
	background-color: #ffffff;
	overflow-x: auto;
	overflow-y: scroll;
	font-family: 'Segoe UI', Arial, Tahoma;
	font-size: 14px;
	}

 a
	{
	color: #F22432;
	text-decoration: none;
	}

 img
	{
	border: none;
	}

 .hidden
	{
	display: none;
	}

 #root
	{
	margin: 0px auto;
	padding-bottom: 380px;
	width: 100%;
	min-width: 320px;
	}

 .wrapper
	{
	margin: 0px auto;
	width: 100%;
	max-width: 1200px;
	min-width: 320px;
	box-sizing: border-box;
	}


/*----------------- HEADER --------------------------------------------------------------------------------------------------------------------------------*/

 #header
	{
	display: block;
	height: 74px;
	background-color: #23262b;
	z-index: 30;
	}

 #header .wrapper
	{
	position: relative;
	height: 100%;
	}

 #header .link
	{
	display: inline-block;
	margin: 0 -2px;
	padding: 0 15px;
	font-size: 18px;
	color: #ffffff;
	height: 74px;
	line-height: 68px;
	}
 #header .link:hover
	{
	background-color: RGBA(255,255,255, 0.3);
	}
 #header .link.active
	{
	background-color: #f0e800;
	color: #222222;
	}

 #header .social
	{
	display: inline-block;
	position: absolute;
	top: 11px;
	left: 30px;
	}

 #header .social > a
	{
	display: inline-block;
	margin: 0px 5px;
	width: 50px;
	height: 50px;
	line-height: 50px;
	border-radius: 50%;
	background: url('images/social1.png?v3') 0 0 no-repeat;
	}

 #header .social .vk { background-position: -50px 0; }
 #header .social .facebook { background-position: 0px 0; }
 #header .social .insta { background-position: -101px 0; }

 #header .top-menu
	{
	display: inline-block;
	position: absolute;
	top: 0px;
	right: 200px;
	text-align: right;
	}

 #header .top-menu .user
	{
	display: inline-block;
	margin-left: 30px;
	padding-left: 22px;
	height: 74px;
	line-height: 70px;
	font-size: 18px;
	color: #ffffff;
	background: url('images/user.png') left center no-repeat;
	background-size: 18px auto;
	}

 #header .top-menu .exit
	{
	display: inline-block;
	margin-left: 10px;
	height: 74px;
	line-height: 70px;
	font-size: 16px;
	color: #c0c0c0;
	}
 #header .top-menu .exit:hover
	{
	color: #ff5050;
	text-decoration: underline;
	}


/*----- LANGUAGES -----*/

 #header .languages
	{
	position: absolute;
	top: 16px;
	right: 40px;
	width: 100px;
	text-align: left;
	background-color: #23262b;
	border: 1px solid transparent;
	z-index: 50;
	}

 #header .languages > span
	{
	display: block;
	padding: 2px 6px;
	font-size: 22px;
	text-transform: uppercase;
	color: #ffffff;
	background: url('images/open-langs.png') right 5px top 8px no-repeat;
	cursor: pointer;
	}

 #header .languages > a
	{
	display: none;
	margin-bottom: -2px;
	padding: 2px 6px;
	font-size: 22px;
	text-transform: uppercase;
	color: #ffffff;
	text-decoration: none;
	}
 #header .languages > a:hover
	{
	background-color: RGBA(255,255,255,0.4);
	}
 #header .languages > a.active
	{
	display: none !important;
	}

 #header .languages:hover { border: 1px solid #aaaaaa; }

 #header .languages:hover a { display: block; }


 #header .languages2 { display: none; }

 #header .mobile-menu { display: none; }

 #mobile-top { display: none; }


/*----------------- MENU ----------------------------------------------------------------------------------------------------------------------------------*/

 #menu
	{
	display: block;
	position: relative;
	height: 118px;
	z-index: 20;
	background-color: #ffffff;
	}

 #menu:after
	{
	content: '';
	position: absolute;
	top:0; bottom:0;
	left:0;
	width: 50%;
	background-color: #F22432;
	}

 #menu .wrapper
	{
	position: relative;
	height: 100%;
	background: url('images/head-bg.png') top left no-repeat;
	background-color: #ffffff;
	z-index: 10;
	}

 #menu .logo
	{
	position: absolute;
	top: 10px;
	left: 40px;
	}

 #menu .mobile-menu
	{
	display: none;
	}

 #line-gray
	{
	position: absolute;
	left: 215px;
	right: 0px;
	bottom: 0px;
	border-bottom: 9px solid #c0c1c4;
	}

 #line-red
	{
	position: absolute;
	left: 210px;
	bottom: 0px;
	width: 150px;
	border-bottom: 9px solid #F22432;
	}

 .menu
	{
	position: absolute;
	bottom: 12px;
	left: 250px;
	}

 .menu .cat-1
	{
	position: relative;
	display: inline-block;
	padding: 10px 10px;
	font-size: 20px;
	color: #222222;
	z-index: 100;

	-webkit-transition: all 200ms linear;
	-moz-transition: all 200ms linear;
	-o-transition: all 200ms linear;
	transition: all 200ms linear;
	}

 .menu .cat-1.active
	{
	*background-color: #f5f5f5;
	}

 .menu li:hover .cat-1
	{
	background-position: 0 -100%;
	-webkit-animation: MENU-ANIM 400ms 1;
  	-moz-animation:    MENU-ANIM 400ms 1;
  	-o-animation:      MENU-ANIM 400ms 1;
  	animation:         MENU-ANIM 400ms 1;
	}

 .menu .submenu
	{
	margin-top: 60px;
	margin-left: 12px;
	background-color: #c0c1c4;
	min-width: 220px;
	}

 .menu .cat-2
	{
	display: block;
	text-decoration: none;
	color: #333333;
	padding: 10px 10px;
	font-size: 16px;
	white-space: nowrap;
	text-align: left;
	border-bottom: 1px dashed #ffffff;
	}

 .menu ul li:last-child .cat-2
	{
	border-bottom: none;
	}

 .menu .cat-2.active
	{
	margin-top: -1px;
	background-color: #F22432;
	color: #ffffff;
	border: none;
	}

 .menu .cat-2:not(.active):hover
	{
	background-color: RGBA(255,255,255,0.3);
	}

 #menu + .box-shadow
	{
	position: relative;
	margin: -22px 80px 0 80px;
	height: 20px;
	border-radius: 50%;
	box-shadow: 0 10px 10px RGBA(0,0,0, 0.2);
	z-index: 10;
	}

/*----------------- MAIN PHOTO ----------------------------------------------------------------------------------------------------------------------------*/

 .main-photo
	{
	position: relative;
	z-index: 10;
	}

 .main-photo img
	{
	*margin-top: -325px;
	width: 100%;
	}

 .main-photo .slogan
	{
	position: absolute;
	left:0; right:0;
	bottom: 0px;
	background-color: RGBA(255,255,255,0.3);
	text-align: center;
	padding: 15px 10px 20px 10px;
	font-size: 26px;
	color: #ffffff;
	text-shadow: 1px 1px 1px RGBA(0,0,0, 0.5);
	}


/*----------------- MAIN ----------------------------------------------------------------------------------------------------------------------------------*/

 #main
	{
	display: block;
	width: 100%;
	margin: 20px auto;
	padding: 0 20px;
	min-height: 300px;
	box-sizing: border-box;
	}

 #main h1
	{
	margin: 0 0 22px 0;
	font-size: 28px;
	font-weight: normal;
	text-align: left;
	}

 #main .content
	{
	position: relative;
	margin: 0 auto;
	width: 100%;
	max-width: 880px;
	}

 #main img,
 #main table,
 #main iframe
	{
	max-width: 100%;
	}

 #main .submit-btn
	{
	display: inline-block;
	padding: 8px 15px;
	min-width: 100px;
	box-sizing: border-box;
	border: none;
	background-color: #F22432;
	font-family: 'Open Sans';
	font-size: 16px;
	color: #ffffff;
	text-align: center;
	cursor: pointer;
	outline: none;
  	-webkit-appearance: none;

	-webkit-transition: background 100ms linear;
	-moz-transition: background 100ms linear;
	-o-transition: background 100ms linear;
	transition: background 100ms linear;	
	}
 #main .submit-btn:hover
	{
	background-color: #ff7130;	
	}


/*----------------- FOOTER --------------------------------------------------------------------------------------------------------------------------------*/

 #footer
	{
	display: block;
	position: absolute;
	left:0; right:0; bottom:0;
	margin: 0 auto;
	width: 100%;
	box-sizing: border-box;
	background-color: #f4f4f4;
	}

 #footer > .wrapper
	{
	*max-width: 950px;
	padding: 20px 0px;
	}


/*-------- PARTNERS --------*/

 #partners-block
	{
	padding: 15px 0;
	background-color: #ffffff;
	}

 #partners
	{
	position: relative;
	height: 80px;
	width: 100%;
	max-width: 950px;
	}

 .partner img
	{
	max-width: 140px !important;
	max-height: 60px !important;
	}

 #partners-back
	{
	width: 35px;
	background-image: url('images/back.png');
	}

 #partners-next
	{
	width: 35px;
	background-image: url('images/next.png');
	}

 #partners-back:active,
 #partners-next:active
	{
	-webkit-transform: scale(0.9);
	-moz-transform: scale(0.9);
	-o-transform: scale(0.9);
	transform: scale(0.9);
	}


/*----- TABLE1 -----*/

 #footer .table
	{
	display: table;
	width: 100%;
	table-layout: fixed;
	}

 #footer .table > div
	{
	display: table-cell;
	vertical-align: top;
	text-align: left;
	box-sizing: border-box;
	*width: 25%;
	}

 #footer .col-logo
	{
	*width: 200px;
	width: 20%;
	padding-right: 50px;
	vertical-align: middle !important;
	}
 #footer .col-menu
	{
	padding-right: 50px;
	}
 #footer .col-catalog
	{
	padding-right: 50px;
	}
 #footer .col-social
	{
	width: 200px;
	}

 #footer h4
	{
	margin: 0 0 14px 0;
	font-size: 16px;
	font-weight: bold;
	color: #505050;
	text-transform: uppercase;
	}

 #footer h5
	{
	margin: 0 0 10px 0;
	font-size: 18px;
	font-weight: normal;
	}

 #footer .col-menu div
	{
	margin: 5px 0;
	}
 #footer .col-menu a
	{
	color: #000000;
	}
 #footer .col-menu a:hover
	{
	text-decoration: underline;
	}

 #footer .contacts > *
	{
	display: block;
	margin: 5px 0;
	color: #000000;
	background-repeat: no-repeat;
	}
 #footer .contacts > a:hover
	{
	text-decoration: underline;
	}

 #footer .phone
	{
	background-image: url('images/contacts.png');
	background-position: 0 0px;
	padding-left: 28px;
	line-height: 25px;
	}
 #footer .email
	{
	background-image: url('images/contacts.png');
	background-position: 0 -28px;
	padding-left: 28px;
	line-height: 25px;
	}
 #footer .skype
	{
	background-image: url('images/contacts.png');
	background-position: 0px -54px;
	padding-left: 28px;
	line-height: 27px;
	}
 #footer .address
	{
	}


/*----- SOCIAL -----*/

 #footer .col-social .contacts2
	{
	display: none;
	}

 #footer .social
	{
	margin-top: 15px;
	}

 #footer .social > span
	{
	margin-right: 8px;
	}

 #footer .social > a
	{
	display: inline-block;
	margin: 0px 2px;
	width: 30px;
	height: 30px;
	line-height: 30px;
	border-radius: 50%;
	background: url('images/social2.png?v2') 0 0 no-repeat;
	}
 #footer .social > a:hover
	{
	opacity: 0.8;
	}

 #footer .social .vk { background-position: -35px 0; }
 #footer .social .facebook { background-position: 0 0; }
 #footer .social .insta { background-position: -69px 0; }


/*----- BOTTOM -----*/

 #footer .bottom
	{
	position: relative;
	margin-top: 10px;
	background-color: #24262d;
	}

 #footer .bottom:after
	{
	content: '';
	position: absolute;
	top:0; bottom:0;
	left:0;
	width: 50%;
	background-color: #F22432;
	}

 #footer .wrapper
	{
	position: relative;
	height: 100%;
	z-index: 10;
	}

 #footer .table2
	{
	display: table;
	width: 100%;
	table-layout: fixed;
	}

 #footer .table2 > div
	{
	display: table-cell;
	vertical-align: top;
	text-align: center;
	padding: 12px 20px;
	box-sizing: border-box;
	font-size: 18px;
	background-color: #24262d;
	color: #f2f2f2;
	}

 #footer .table2 > .L-col
	{
	width: 20%;
	background-color: #F22432;
	}
 #footer .table2 > .C-col
	{
	text-align: center;
	}
 #footer .table2 > .R-col
	{
	width: 22%;
	text-align: right;
	}

 #footer .table2 a
	{
	color: #f2f2f2;
	}
 #footer .table2 a:hover
	{
	text-decoration: underline;
	}


/*----------------- ANIMATION -----------------------------------------------------------------------------------------------------------------------------*/

 @-webkit-keyframes MENU-ANIM
	{
  	0%   { -webkit-transform: translate(0px, 0px); }
  	50% { -webkit-transform: translate(0px, -5px); }
  	100% { -webkit-transform: translate(0px, 0px); }
	}
 @-moz-keyframes MENU-ANIM
	{
  	0%   { -moz-transform: translate(0px, 0px); }
  	50% { -moz-transform: translate(0px, -5px); }
  	100% { -moz-transform: translate(0px, 0px); }
	}
 @-o-keyframes MENU-ANIM
	{
  	0%   { -o-transform: translate(0px, 0px); }
  	50% { -o-transform: translate(0px, -5px); }
  	100% { -o-transform: translate(0px, 0px); }
	}
 @keyframes MENU-ANIM
	{
  	0%   { transform: translate(0px, 0px); }
  	50% { transform: translate(0px, -5px); }
  	100% { transform: translate(0px, 0px); }
	}


/*----------------- DESCTOP -------------------------------------------------------------------------------------------------------------------------------*/

@media (min-width: 700px) 
 {
 #root
	{
	padding-top: 190px;
	}

 #top
	{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 50;
	box-shadow: 0px 2px 5px RGBA(0,0,0, 0.4);

	-webkit-transition: all 0.3s ease-in;
	-moz-transition: all 0.3s ease-in;
	-o-transition: all 0.3s ease-in;
	transition: all 0.3s ease-in;
	}

 #top.small
	{
	-webkit-transform: translate(0px,-74px);
	-moz-transform: translate(0px,-74px);
	-o-transform: translate(0px,-74px);
	transform: translate(0px,-74px);
	}
 }

/*----------------- MOBILE --------------------------------------------------------------------------------------------------------------------------------*/


@media (max-width: 1050px) 
 {

 #header .languages
	{
	right: 20px;
	}

 #header .top-menu
	{
	right: 130px;
	}

 .menu li
	{
	margin: 0;
	}

 .menu .cat-1
	{
	padding: 7px 10px;
	}

 .menu .submenu
	{
	margin-top: 54px;
	}
 }


@media (max-width: 900px) 
 {
 .menu .cat-1
	{
	font-size: 16px;
	}

 .menu .submenu
	{
	margin-top: 47px;
	}

 #partners-block
	{
	display: none;
	}

 #root
	{
	padding-bottom: 0;
	}

 #footer
	{
	position: static;
	padding-top: 12px;
	}

 #footer > .wrapper
	{
	padding: 10px 20px;
	}

 #footer .table
	{
	width: auto;
	}

 #footer .col-menu,
 #footer .col-contact
	{
	display: none !important;
	}

 #footer .L-col,
 #footer .R-col
	{
	display: none !important;
	}
 }


@media (max-width: 700px) 
 {
 #root
	{
	padding-top: 50px;
	}

 #header
	{
	position: fixed;
	top:0; left:0; right:0;
	height: 50px;
	}

 #header .link
	{
	height: 50px;
	line-height: 48px;
	padding: 0 8px;
	}

 #header .top-menu
	{
	position: static;
	text-align: left;
	margin-left: 10px;
	}

 #header .social
	{
	position: static;
	margin-left: 25px;
	}

 #header .social > a
	{
	margin: 0px 1px;
	width: 33px;
	height: 33px;
	line-height: 36px;
	background-size: 102px auto;
	}

 #header .social .vk { background-position: -34px 0; }
 #header .social .insta { background-position: -68px 0; }

 #header .top-menu .user
	{
	margin-left: 10px;
	height: 50px;
	line-height: 46px;
	}

 #header .top-menu .exit
	{
	height: 50px;
	line-height: 46px;
	}
/*
 #header .languages
	{
	top: 6px;
	width: 80px;
	}

 #header .languages > span
	{
	font-size: 20px;
	background-position: right 5px center;
	background-size: 26px auto;
	}

 #header .languages > a
	{
	padding: 2px 6px;
	font-size: 20px;
	}
*/
 #mobile-top
	{
	display: block;
	position: relative;
	text-align: center;
	background-color: #F22432;
	}

 #mobile-top img
	{
	margin: 10px auto;
	widh: 90px;
	}

 #header .languages
	{
	display: none;
	}

 #header .languages2
	{
	display: block;
	position: absolute;
	top: 15px;
	right: 50px;
	}

 #header .languages2 > a
	{
	display: inline-block !important;
	margin-right: -3px;
	padding: 0 10px;
	font-size: 16px;
	color: #ffffff;
	line-height: 18px;
	border-left: 1px solid #ffffff;
	}
 #header .languages2 > a:hover
	{
	text-decoration: underline;
	}
 #header .languages2 > a:first-child
	{
	border: none;
	}

 #header .mobile-menu
	{
	display: inline-block;
	position: absolute;
	top: 9px;
	right: 10px;
	width: 34px;
	height: 31px;
	line-height: 31px;
	background: url("images/mobile-menu.png") center center no-repeat;
	cursor: pointer;
	}
 #header .mobile-menu:hover
	{
	background-color: RGBA(255,255,255, 0.3);
	}

 #menu
	{
	height: auto;
	background: none;
	}

 #menu .logo
	{
	display: none;
	}

 #line-red, #line-gray
	{
	display: none;
	}

 .menu
	{
	position: static;
	display: block;
	}
 .menu.mob-hidden
	{
	display: none;
	}

 .menu ul,
 .menu li,
 .menu .submenu
	{
	position: static;
	display: block;
	margin: 0;
	padding: 0;
	width: 100%;
	}

 .menu .cat-1
	{
	position: relative;
	display: block;
	margin-bottom: -1px;
	padding: 7px 10px;
	font-size: 18px;
	background-color: #23262b;
	color: #ffffff;
	border-top: 1px dotted #bbbbbb;
	border-bottom: 1px dotted #bbbbbb;
	}
 .menu .cat-1.active
	{
	background-color: #43464b;
	}

 .menu li:hover .cat-1
	{
	-webkit-animation: none;
  	-moz-animation:none;
  	-o-animation: none;
  	animation: none;
	}

 .menu .cat-2
	{
	padding: 6px 10px 6px 25px;
	font-size: 16px;
	}

 .main-photo .slogan
	{
	font-size: 22px;
	}
 }

@media (max-width: 530px) 
 {
 #root
	{
	padding-top: 40px;
	}

 #header
	{
	height: 40px;
	}

 #header .social
	{
	display: none;
	}

 #header .languages2
	{
	top: 10px;
	}

 #header .link
	{
	font-size: 16px;
	height: 40px;
	line-height: 36px;
	}

 #header .top-menu .user
	{
	margin-left: 10px;
	height: 40px;
	font-size: 16px;
	line-height: 36px;
	}

 #header .top-menu .exit
	{
	height: 40px;
	font-size: 14px;
	line-height: 36px;
	}

 #header .mobile-menu
	{
	top: 4px;
	}

 #mobile-top img
	{
	margin: 7px auto;
	width: 80px;
	}

 .main-photo .slogan
	{
	padding: 10px 10px 15px 10px;
	font-size: 18px;
	line-height: 22px;
	}

 #footer .table,
 #footer .table > .col-logo,
 #footer .table > .col-social
	{
	display: block;
	width: 100%;
	margin: 0;
	padding-left: 0;
	padding-right: 0;
	text-align: center !important;
	}

 #footer .col-logo img
	{
	width: 120px;
	}

 #footer h5
	{
	margin: 12px 0 8px 0;
	font-size: 16px;
	line-height: 18px;
	}

 #footer .col-social .contacts2
	{
	display: block;
	margin: 20px;
	*background-color: #f8f8f8;
	}

 #footer .col-social .contacts2 a
	{
	display: inline-block;
	font-size: 18px;
	}
 #footer .col-social .contacts2 a:hover
	{
	text-decoration: underline;
	}

 #footer .social
	{
	margin: 0;
	}

 #footer .table2 > div
	{
	padding: 8px 10px;
	font-size: 14px;
	}

 #main h1
	{
	margin: 0 0 16px 0;
	font-size: 22px;
	}
 }


@media (max-width: 420px) 
 {
 .menu .cat-1
	{
	font-size: 14px;
	}

 .menu .cat-2
	{
	font-size: 14px;
	}

 }


@media (max-width: 360px) 
 {
 #header .link
	{
	padding: 0 5px;
	font-size: 14px;
	}

 #header .top-menu .user
	{
	padding-left: 18px;
	background-size: 15px auto;
	font-size: 14px;
	}

 #header .top-menu .exit
	{
	margin-left: 5px;
	font-size: 13px;
	}
 }
