/*	Less Framework 4 with 16/24 type presets
	http://lessframework.com
	by Joni Korpi
	License: http://opensource.org/licenses/mit-license.php	*/


/*	Resets
	------	*/

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, hr, dl, dt, dd, ol, ul, li, fieldset, form, lOswald, legend, 
 caption, tbody, tfoot, thead,  th,  article, aside, canvas, details, figure, figcaption, hgroup, menu, footer, header, nav, section, summary, time, mark, audio, video {
	margin: 0; padding: 0; border: 0; -moz-box-sizing: border-box; box-sizing: border-box;
}

article, aside, canvas, figure, figure img, figcaption, hgroup, footer, header, nav, section, audio, video { display: block; }

a { color: #007cc3; transition:all 0.2s ease 0s; transition-property: background, color; text-decoration: none; }
a:HOVER { color: #018542; text-decoration: underline; }

input { transition: background 0.2s ease 0s; transition-property: background, color;  }
a img {border: 0;}
input, textarea { padding: 5px; -moz-box-sizing: border-box; box-sizing: border-box }
input[type="text"], textarea { color: #2c2c2c; border: 1px solid #c4c4c4; background: #fff; }
textarea { resize: vertical }
img { max-width: 100%; height: auto; }



/* Selection colours (easy to forget) */
/*::selection 	 	   {background: #b4e4ff;}
::-moz-selection 	   {background: #b4e4ff;}
img::selection 		{background: transparent;}
img::-moz-selection	{background: transparent;}
body {-webkit-tap-highlight-color: #b4e4ff;}
*/




/*		Default Layout: 992px. 
		Gutters: 24px.
		Outer margins: 48px.
		Leftover space for scrollbars @1024px: 32px.
-------------------------------------------------------------------------------
cols    1     2      3      4      5      6      7      8      9      10
px      68    160    252    344    436    528    620    712    804    896    */



BODY {
	background: #FFF; -webkit-text-size-adjust: 100%; /* Stops Mobile Safari from auto-adjusting font-sizes */
	color: #444; font-family: Tahoma, Arial, sans-serif; min-width: 300px; 
}

   .wrap { max-width: 1144px; margin: 0 auto; }
   .clr {clear: both }
   .clr:AFTER { content:''; display:block; clear: both; }
   .ovr { overflow: hidden; }



HEADER { width: 100%; display: block; }

   .top_bg{ background: #e50005; }
   .top{ position: relative; min-height: 100px; overflow: visible; }
   .top .logo{
      max-width: 319px; width: 80%; height: 63px; display: block; cursor: pointer;
      background: url(i/logo.png) center center no-repeat; background-size: contain;
      position: absolute; top: 20px; left: 0;
   }   
   .top .logo_desc{ color: rgba(255,255,255,0.8); font-size: 14px;
      position: absolute; top: 40px; left: 340px; width: 160px;
   }

   @media (max-width: 600px){
      .top .logo{ width: 55%; }   
      .top .logo_desc{ font-size: 12px; top: 45px; left: 58%; width: 140px; }
   }
   @media (max-width: 500px){
      .top .logo_desc{ font-size: 11px; width: 120px; }
   }
   @media (max-width: 400px){
      .top .logo_desc{ top: 35px; width: 90px; }
   }

/* меню */
   #menu_top{ position: absolute; right: 0px; top: 40px; z-index: 100; }
   #menu_top > UL{ overflow: auto; list-style: none; background: #e50005; }
   #menu_top > UL > LI{ margin: 0; padding: 0; }
   #menu_top > UL > LI > A{ color: #FFF; text-decoration: none; font-size: 15pt; display: block; padding: 8px 16px; }
   #menu_top > UL > LI > A.current{ color: #999; }
   #menu_top > UL > LI > A:HOVER{ background-color: rgba(255,255,255,0.2); }
   #menu_top > UL > LI > A:ACTIVE{ background-color: #FFF; color: red; }
   .menu_top_btn{ background: url(i/menu_smart.png) center no-repeat; width: 50px; height: 50px; position: absolute; top: 25px; right: 0px; cursor: pointer; }

   @media (min-width: 1056px){
      #menu_top > UL > LI{ float: left; }
      .menu_top_btn{ display: none; }
   }
   @media (max-width: 1055px){
      #menu_top > UL{ }
      #menu_top{ top: 100px; width: 100%; }
      #menu_top > UL > LI{ width: 100%; border-top: 1px solid red; }
      #menu_top{display: none;}
   }



/* визуал */

   .top_visual{ background: url(img/vis_sm.jpg) top center no-repeat; background-size: cover; }
   .top_visual .text { margin: 10px 0px; }
   .top_visual .text H1{ font-size: 100%; color: #018542; font-weight: normal; margin-bottom: 10px;  }
   .top_visual .text H2{ font-size: 70%; color: #5c5e5e; font-weight: normal; margin-bottom: 40px; line-height: 120%; }
   .top_visual .text A.btn_more{
      font-size: 80%; color: #FFF; background: #e50005; border: 0; padding: 10px 24px 12px 24px; cursor: pointer;
      box-shadow: 2px 2px 3px rgba(0,0,0,0.3); text-shadow: 1px 1px 2px rgba(0,0,0,0.3); text-decoration: none; white-space: nowrap; 
   }
   .top_visual .text A.btn_more:HOVER{ background: #ea3337; }
   .top_visual .text A.btn_more:ACTIVE{ color: #e50005; background: #FFF; }

   /* для смарта и планшета */
   @media (max-width: 768px){ .top_visual .text { padding: 520px 0 50px 0; margin: 0 5%; text-align: center; font-size: 22pt; } }
   @media (max-width: 720px){ .top_visual .text { padding: 500px 0 50px 0; } }
   @media (max-width: 650px){ .top_visual .text { padding: 450px 0 50px 0; } }
   @media (max-width: 600px){ .top_visual .text { padding: 420px 0 50px 0; font-size: 18pt; } }
   @media (max-width: 550px){ .top_visual .text { padding: 360px 0 40px 0; } }
   @media (max-width: 500px){ .top_visual .text { padding: 330px 0 40px 0; } }
   @media (max-width: 450px){ .top_visual .text { padding: 290px 0 40px 0; } }
   @media (max-width: 420px){ .top_visual .text { padding: 270px 0 30px 0; font-size: 16pt; } }

   /* для ПК */
   @media (min-width: 769px){
      .top_visual{ height: 613px; background: url(img/vis_pc.jpg) center no-repeat; background-size: cover; }
      .top_visual .wrap{ position: relative; }
      .top_visual .text { width: 33%; position: absolute; right: 0; top: 100px; font-size: 26pt; }
   }

   @media (min-width: 881px) and (max-width: 1090px){
      .top_visual{ height: 580px; }
      .top_visual .text{ font-size: 20pt; }
   }

   @media (min-width: 769px) and (max-width: 880px){
      .top_visual{ height: 480px; }
      .top_visual .text{ font-size: 16pt;  }
   }



.c1{ background: #018542; padding: 80px 0px; text-align: center; color: rgba(255,255,255,0.7); font-size: 13pt; }
   .c1 H1{ margin-bottom: 20px; color: #FFF; }
   .c1 .text{ margin: 0 20px; }
   .c1 a{ font-weight: 100; border: 1px solid #fff; color: rgba(255,255,255,0.7); background: rgba(255,255,255,0.1); padding: 6px 14px 8px 14px; cursor: pointer; text-decoration: none; font-size: 10pt; }
   .c1 a:HOVER{ background: rgba(255,255,255,0.2); color: rgba(255,255,255,1); }

.c2{ background: #FFF; padding: 80px 40px; font-size: 12pt; line-height: 20pt; }
   .c2 H1{ margin-bottom: 40px; color: #7f7f7f; text-align: center; }
   .c2 UL{ overflow: auto; }
   .c2 UL LI{ margin-bottom: 20px; list-style: none; overflow: auto; line-height: 150%; }
   .c2 UL LI DIV{ margin: 0 2%; }   

   @media (min-width: 861px){
      .c2 UL LI{ float: left; width: 25%; text-align: center; }   
   }
   @media (max-width: 860px){
      .c2 UL LI{ padding-left: 110px; }
      .c2 UL LI IMG{ margin-left: -110px; float: left; width: 100px; }   
   }
   @media (max-width: 480px){
      .c2 UL LI{ padding-left: 60px; font-size: 11pt; line-height: 130%; }
      .c2 UL LI IMG{ margin-left: -60px; width: 50px; }   
   }


.c3{ background: url(img/c3_bg.jpg) top center; background-size: cover; padding: 80px 50px; font-size: 12pt; line-height: 16pt; text-align: center; }
   .c3 H1{ margin-bottom: 40px; color: #1a67b5; }
   .c3 UL{ overflow: auto; }
   .c3 UL LI{ margin-bottom: 20px; list-style: none; overflow: auto; }
   .c3 UL LI DIV{ margin: 0 2%; }   
   .c3 a{ font-weight: 100; border: 1px solid #1a67b5; color: #1a67b5; background: rgba(255,255,255,0.1); padding: 6px 14px 8px 14px; cursor: pointer; text-decoration: none; font-size: 10pt; }
   .c3 a:HOVER{ background: rgba(255,255,255,0.2); color: rgba(255,255,255,1); }
   
   @media (min-width: 640px){
      .c3{ text-align: center; }
      .c3 UL LI{ float: left; width: 33.33%; }   
      .c3 UL LI IMG{ margin-bottom: 20px; max-width: 80%; height: auto; }   
   }
   @media (min-width: 640px) & (max-width: 780px){
      .c3{ font-size: 10pt; line-height: 12pt; }
   }
   @media (max-width: 639px){
      .c3{ font-size: 11pt; line-height: 15pt; padding: 60px 20px; }
      .c3 UL LI{ padding-left: 100px; text-align: left; }
      .c3 UL LI IMG{ width: 90px; margin-left: -100px; float: left; }   
   }
   @media (max-width: 420px){
      .c3 UL LI{ padding-left: 60px; }
      .c3 UL LI IMG{ width: 50px; margin-left: -60px; }   
   }


.c4{ padding: 80px 20px; font-size: 12pt; line-height: 16pt; text-align: center; }
   .c4 H1{ margin-bottom: 40px; color: #7f7f7f; }
   .c4 UL{ overflow: auto; }
   .c4 UL LI{ list-style: none; text-align: center; width: 150px; margin: 10px 3%; display: inline-block; vertical-align: top;}
   .c4 UL LI DIV{ margin: 0 2%; }   

   @media (max-width: 600px){
      .c4 UL LI{ width: 95px; margin: 10px 10px; }
   }
   @media (max-width: 420px){
      .c4{ padding: 80px 10px; font-size: 10pt; line-height: 12pt; }
      .c4 UL LI{ width: 80px; margin: 10px 5px; }
   }


.c5{ background: url(img/c5_bg.jpg) center no-repeat #e50005; background-size: cover; padding: 80px 50px; text-align: center; }
   .c5 H1{ margin-bottom: 40px; color: #FFF; }
   .c5 UL{ overflow: auto; list-style: none; }
   .c5 UL LI{ display: inline; }
   .c5 UL LI IMG{ height: 150px; border: 1px solid #FFF; box-shadow: 2px 2px 4px rgba(0,0,0,0.3); margin: 2px; }
   .c5 .wrap{ max-width: 800px; }
   .c5 a{ font-weight: 100; border: 1px solid #fff; color: rgba(255,255,255,0.7); background: rgba(255,255,255,0.1); padding: 6px 14px 8px 14px; cursor: pointer; text-decoration: none; font-size: 10pt; }
   .c5 a:HOVER{ background: rgba(255,255,255,0.2); color: rgba(255,255,255,1); }

   
   @media (max-width: 600px){
      .c5{ padding: 60px 20px; }
      .c5 UL LI IMG{ height: 100px; margin: 1px; }
   }

.c6 .city{ background: #FFF; box-shadow: 4px 0px 8px rgba(0,0,0,0.15); }
   .c6 .city H2 .arrow{ background: url(img/city_arrow.png) bottom no-repeat; width: 20px; height: 20px; display: inline-block; margin-bottom: -3px; }
   .c6 .city LI{ list-style: none; padding-left: 24px; background: url(img/city_bull.png) 0px 1px no-repeat; position: relative; cursor: pointer;}
   .c6 .city LI A{ text-decoration: none; /*color: #444;*/ color:#007cc3; }
   .c6 .map{ height: 700px; background: #CCC; }
   .c6 .city LI{ margin: 0 10px 10px 0; }

   @media (min-width: 640px){
      .c6{ overflow: auto; position: relative; font-size: 11pt; }
      .c6 .city{ height: 100%; position: absolute; top: 0; left: 0; z-index: 99; padding: 10px 20px 20px 40px; }
      .c6 .city H2{ font-size: 16pt; font-weight: normal; margin-bottom: 10px; padding-right: 40px; }
   }
   @media (max-width: 639px){
      .c6{ font-size: 9pt; }
      .c6 .city{ padding: 10px 20px; }
      .c6 .city H2{ font-size: 12pt; margin-bottom: 10px; }
      .c6 .city LI{ display: inline-block; min-width: 48%; margin: 0 1% 10px 0; vertical-align: top; }
   }



   .c1 H1, .c2 H1, .c3 H1, .c4 H1, .c5 H1, .c6 H1 { font-size: 18pt; line-height: 22pt; }

   @media (max-width: 640px){
      .c1 H1, .c2 H1, .c3 H1, .c4 H1, .c5 H1, .c6 H1 { font-size: 14pt; line-height: 18pt; }
   }


#content{ min-height: 400px; font-size: 11pt; line-height: 16pt; padding: 10px 10px 10px 30px;  }
   #content H1{ font-size: 26pt; line-height: 30pt; font-weight: normal; margin-bottom: 16px; }
   #content H2{ font-size: 20pt; line-height: 24pt; font-weight: bold; margin: 16px 0; }
   #content H3{ font-size: 14pt; line-height: 18pt; font-weight: bold; margin: 16px 0; }
   #content H4{ font-size: 13pt; line-height: 16pt; font-weight: bold; margin: 16px 0; }
   #content H5{ font-size: 12pt; line-height: 15pt; font-weight: bold; margin: 16px 0; }
   #content H6{ font-size: 11pt; line-height: 14pt; font-weight: bold; margin: 16px 0; }
   #content H6{ font-size: 11pt; line-height: 14pt; font-weight: bold; margin: 16px 0; }
   #content UL{ list-style: square; padding-left: 20px; }
   #content P{ margin-bottom: 16px; }


.footer{ background: #e50005; padding: 20px 50px 70px 50px; text-align: center; color: #FFF; position: relative; font-size: 12pt; }
   .footer BIG{ font-size: 18pt; font-weight: bold; }
   .footer A{ color: rgba(255,255,255,0.8); }
   .footer A:HOVER{ color: #FFF; }
                                                                                                                                                              
   .credits{ text-align: right; font-size: 7.5pt; position: absolute; right: 10px; bottom: 10px; color: rgba(255,255,255,0.5); }
   .credits A{ color: rgba(255,255,255,0.5); }

   @media (max-width: 600px){
      .footer{ font-size: 11pt; }
      .footer BIG{ font-size: 13pt; }
   }


/*
   Полезные ссылки
*/
   .useful_links{ max-width: 280px; width: 100%; font-size: 9pt; background: #fff; position: absolute; top: 100px; left: -276px; z-index: 60; box-shadow: 0px 0px 10px rgba(0,0,0,0.2); overflow: visible; }
   .useful_links H2{ font-size: 10pt; margin: 20px 0 5px 0; }
   .useful_links UL{ list-style: square; padding-left: 20px; margin: 20px 20px 20px 10px; }
   .useful_links UL LI{ margin-bottom: 6px; }
   .useful_links_button{ background: url(i/usefull_links2.png) no-repeat; width: 29px; height: 190px; position: absolute; right: -29px; top: -4px; cursor: pointer; }

   @media (max-width: 480px){
/*      .useful_links{ display: none; }*/
   }
  

/*
   ФОРМА ЗАКАЗА
*/

.zakaz{ border: 1px solid #FFF; background: #f5f5f5; position: absolute; top: 2%; left: 2%; z-index: 999; width: 96%; box-shadow: 0px 0px 10px rgba(0,0,0,0.3); 
   display: none;
}
   .zakaz .zakaz-container{ margin: 40px; }   
   .zakaz .close{ background: url(i/zakaz_close.png) center no-repeat; width: 32px; height: 32px; cursor: pointer; position: absolute; right: 6px; top: 6px; }

   .zakaz TABLE{ margin-top: 10px; width: 100%; }
   .zakaz TABLE TH{ border-bottom: 4px solid red; padding: 4px 6px; font-size: 12pt; }
   .zakaz TABLE TD{ border-bottom: 1px solid #dcdcdc; padding: 4px 10px; font-size: 12pt; }
   .zakaz TABLE TD.z_name{ font-size: 11pt; }
   .zakaz TABLE TD.z_price{ text-align: right; white-space: nowrap; }
   .zakaz TABLE TD.z_price_s{ text-align: right; white-space: nowrap; }

   .zakaz TABLE TD.z_qty{ text-align: center; }
   .zakaz TABLE TD.z_qty INPUT{ font-size: 11pt; width: 40px; text-align: right; }
   .zakaz TABLE TR:last-child TD{ border-top: 4px solid red; border-bottom: 0px; padding: 4px 6px; }
   .zakaz TABLE TD.z_img{ width: 80px; }
   
   .zakaz .info{ font-size: 11pt;  margin: 20px 0; overflow: auto; }
      .zakaz .info H3{ font-size: 11pt; margin: 20px 0; font-weight: normal; }
      .zakaz .info DIV{ font-size: 11pt; margin: 10px 0; }
      .zakaz .info DIV INPUT{ font-size: 11pt; width: 100%; }
      .zakaz .info DIV INPUT.zi_phone{ width: 49%; float: left; }
      .zakaz .info DIV INPUT.zi_email{ width: 49%; float: right; }

   .zakaz .btn_order{ text-align: right; }
   .zakaz .btn_order BUTTON{
      font-size: 14pt; color: #FFF; background: #aecb06; border: 0; padding: 10px 24px 12px 24px; cursor: pointer;
      box-shadow: 2px 2px 3px rgba(0,0,0,0.3); text-shadow: 1px 1px 2px rgba(0,0,0,0.3); text-decoration: none; white-space: nowrap;
   }
   .zakaz .btn_order BUTTON:HOVER{ background: #018542; }
   .zakaz .btn_order BUTTON:ACTIVE{ color: #018542; background: #FFF; }


   @media (max-width: 640px){
      .zakaz{ border: 0; top: 0; left: 0; width: 100%; }
      .zakaz .zakaz-container{ margin: 40px 10px; }   
      .zakaz TABLE TH{ border-bottom: 4px solid red; padding: 4px 6px; font-size: 10pt; }
      .zakaz TABLE TD{ padding: 2px; font-size: 10pt; }
      .zakaz TABLE TD.z_name{ font-size: 10pt; }
      .zakaz TABLE TD.z_qty INPUT{ font-size: 10pt; width: 40px; }
      .zakaz .info DIV INPUT.zi_phone, .zakaz .info DIV INPUT.zi_email{ width: 100%; float: none; }
      .zakaz TABLE TD.z_img{ width: 0px; }
      .zakaz .smart_hide{ display: none; }
      
   }

   @media (max-width: 420px){
      .zakaz TABLE TD.z_img IMG{ display: none; }
   }


/*   @media (max-width: 1200px){
section {padding-left: 20px;}
   }*/



.rad_btn{
   -moz-border-radius: 20px; /* закругление для старых Mozilla Firefox */
   -webkit-border-radius: 20px; /* закругление для старых Chrome и Safari */
   -khtml-border-radius:20px; /* закругл. для браузера Konquerer системы Linux */
   border-radius: 20px; /* закругление углов для всех, кто понимает */
 }

 .choice_city.active::before {
   position: absolute;
   top: 8px;
   left: 7px;
   content: '';
   display: inline-block;
   width: 6px;
   height: 6px;
   border-radius: 50%;
   overflow: hidden;
   background-color: #C0C0C0;
}



#block_right{
	display: none;
	z-index:9998;
	position:fixed;
	bottom:0px; right:0px;
	width:54px;
	height:54px;
	border:1px solid #aaa;
	border-radius: 20px 0 0 0;
	-moz-border-radius: 20px 0 0 0;
    -webkit-border-radius: 20px 0 0 0;
	
	background:url(/images/arrow.png) 0 0 no-repeat;
	
    cursor: pointer;
    border: 1px solid rgba(0,0,0,0.5);
    border-bottom: 3px solid rgba(0,0,0,0.5);
   
    box-shadow: 0 2px 8px rgba(0,0,0,0.5), /* Exterior Shadow */
      inset 0 1px rgba(255,255,255,0.3), /* Top light Line */
      inset 0 10px rgba(255,255,255,0.2), /* Top Light Shadow */
      inset 0 10px 20px rgba(255,255,255,0.25), /* Sides Light Shadow */
      inset 0 -15px 30px rgba(0,0,0,0.3); /* Dark Background */
    -webkit-box-shadow: 0 2px 8px rgba(0,0,0,0.5),
      inset 0 1px rgba(255,255,255,0.3),
      inset 0 10px rgba(255,255,255,0.2),
      inset 0 10px 20px rgba(255,255,255,0.25),
      inset 0 -15px 30px rgba(0,0,0,0.3);
    -moz-box-shadow: 0 2px 8px rgba(0,0,0,0.5),
      inset 0 1px rgba(255,255,255,0.3),
      inset 0 10px rgba(255,255,255,0.2),
      inset 0 10px 20px rgba(255,255,255,0.25),
      inset 0 -15px 30px rgba(0,0,0,0.3);
}
#block_right:hover{background-color: #aaa;}