body {
   max-width: 1200px;
   text-align: center;
   margin: 0 auto; /* задаем отступ слева и справа auto чтобы сработало выравнивание по центру */
}

img {
    max-width: 100%;
}

.menu:link      { FONT-SIZE: 12px; COLOR: #2740BF; FONT-FAMILY: Arial; line-height: 1.5; }
.menu:visited   { FONT-SIZE: 12px; COLOR: #2740BF; FONT-FAMILY: Arial; line-height: 1.5; }
.menu:hover     { FONT-SIZE: 12px; COLOR: #e85222; FONT-FAMILY: Arial; line-height: 1.5; }
.menu:active    { FONT-SIZE: 12px; COLOR: darkblue; FONT-FAMILY: Arial; line-height: 1.5; }

.ltmenu:link    { FONT-SIZE: 12px; COLOR: #2740BF; FONT-FAMILY: Arial; line-height: 1.5; }
.ltmenu:visited { FONT-SIZE: 12px; COLOR: #2740BF; FONT-FAMILY: Arial; line-height: 1.5; }
.ltmenu:hover   { FONT-SIZE: 12px; COLOR: #e85222; FONT-FAMILY: Arial; line-height: 1.5; }
.ltmenu:active  { FONT-SIZE: 12px; COLOR: darkblue; FONT-FAMILY: Arial; line-height: 1.5; }

.lk:link        { FONT-SIZE: 12px; COLOR: #2740BF; FONT-FAMILY: Arial; }
.lk:visited     { FONT-SIZE: 12px; COLOR: #2740BF; FONT-FAMILY: Arial; }
.lk:hover       { FONT-SIZE: 12px; COLOR:#2740BF; FONT-FAMILY: Arial;  }
.lk:active      { FONT-SIZE: 12px; COLOR: #2740BF; FONT-FAMILY: Arial;  }

.h1             { FONT-SIZE: 16px; FONT-FAMILY: Arial; TEXT-DECORATION: none }
.h2             { FONT-SIZE: 15px; FONT-FAMILY: Arial; TEXT-DECORATION: none; margin-top: 2px; }

.text           { FONT-SIZE: 14px; COLOR: #000000; FONT-FAMILY: Arial; TEXT-DECORATION: none }
.main           { FONT-SIZE: 14px; COLOR: #000000; FONT-FAMILY: Arial; TEXT-DECORATION: none; text-align: left;  }
.textinfo       { FONT-SIZE: 14px; COLOR: #000000; FONT-FAMILY: Arial; TEXT-DECORATION: none; }
.navinfo       { FONT-SIZE: 12px; COLOR: #000000; FONT-FAMILY: Arial; TEXT-DECORATION: none; padding-bottom: 12px; }

.tes       { FONT-SIZE: 10px; padding-top: 6px; float: left;}
.buy       { float: right;}

.filter { FONT-SIZE: 12px; border: 1px solid #D4D4D4; border-width: 1px; background: #EFEFEF; padding: 6px 6px; }
.colorfiltrer { margin-left: 5px;  padding-left: 30px; }

UL.one { padding: 0px; margin: 0 0 10px 0; list-style: none; }
UL.two { padding: 0px; margin: 0 0 0 16px; list-style-image: url(img/dot2.gif); }
UL.three { padding: 0px; margin: 0 0 0 16px; list-style-image: url(img/dot.gif); }

UL.top { padding: 0px; margin: 0 0 0 0px; list-style-image: url(img/dot2.gif); list-style-position: inside; }
UL.new { padding: 0px; margin: 0 0 0 0px; list-style-image: url(img/dot2.gif); list-style-position: inside; }

.navinfoavtive  { FONT-SIZE: 12px; COLOR: #000000; FONT-FAMILY: Arial; background: #ffeba0; font-weight: bold; padding: 1 4 1 5; border-style: solid; border-width: 1px; line-height: 1.7; }
.navinfoinavtive:link    { FONT-SIZE: 12px; COLOR: #2740BF; FONT-FAMILY: Arial; font-weight: bold; padding: 1 4 1 5; border-style: solid; border-width: 1px; line-height: 1.7; text-decoration: none; }
.navinfoinavtive:visited { FONT-SIZE: 12px; COLOR: #2740BF; FONT-FAMILY: Arial; font-weight: bold; padding: 1 4 1 5; border-style: solid; border-width: 1px; line-height: 1.7; text-decoration: none; }
.navinfoinavtive:hover   { FONT-SIZE: 12px; COLOR: #e85222; FONT-FAMILY: Arial; font-weight: bold; padding: 1 4 1 5; border-style: solid; border-width: 1px; line-height: 1.7; text-decoration: none; }
.navinfoinavtive:active  { FONT-SIZE: 12px; COLOR: darkblue; FONT-FAMILY: Arial; font-weight: bold; padding: 1 4 1 5; border-style: solid; border-width: 1px; line-height: 1.7; text-decoration: none;  }

.navinfoactivetovar  { FONT-SIZE: 15px; COLOR: #000000; FONT-FAMILY: Arial; background: #ffeba0; font-weight: bold; padding: 1 5 1 5; border-style: solid; border-width: 1px; line-height: 1.7; text-decoration: none; cursor: default;}
.navinfoinactivetovar:link    { FONT-SIZE: 15px; COLOR: #2740BF; FONT-FAMILY: Arial; font-weight: bold; padding: 1 5 1 5; border-style: solid; border-width: 1px; line-height: 1.7; text-decoration: none; }
.navinfoinactivetovar:visited { FONT-SIZE: 15px; COLOR: #2740BF; FONT-FAMILY: Arial; font-weight: bold; padding: 1 5 1 5; border-style: solid; border-width: 1px; line-height: 1.7; text-decoration: none; }
.navinfoinactivetovar:hover   { FONT-SIZE: 15px; COLOR: #e85222; FONT-FAMILY: Arial; font-weight: bold; padding: 1 5 1 5; border-style: solid; border-width: 1px; line-height: 1.7; text-decoration: none; }
.navinfoinactivetovar:active  { FONT-SIZE: 15px; COLOR: darkblue; FONT-FAMILY: Arial; font-weight: bold; padding: 1 5 1 5; border-style: solid; border-width: 1px; line-height: 1.7; text-decoration: none;  }
.divnavtovar { padding-top: 10px; }


IMG.tovar        { 	BORDER-WIDTH: 1px; BORDER-COLOR: #2740BF; }

.head          { FONT-SIZE: 14px; COLOR: #000000; FONT-FAMILY: Arial; line-height: 1.3; }

.basket         { border-style: solid; border-width: 1px; padding: 4px; line-height: 1.3; }

.age18plus         { max-width: 280px; margin: 1px auto; }

.inputemail { color:#999; margin-top: 4px; margin-bottom: 4px;}
.inputemail:focus { color:#000; margin-top: 4px; margin-bottom: 4px;}

.logo:link      { FONT-SIZE: 22px; COLOR: #2740BF; FONT-FAMILY: Arial; text-shadow: 1px 1px rgba(0, 0, 0, 0.4); TEXT-DECORATION: none; }
.logo:visited   { FONT-SIZE: 22px; COLOR: #2740BF; FONT-FAMILY: Arial; text-shadow: 1px 1px rgba(0, 0, 0, 0.4); TEXT-DECORATION: none; }
.logo:hover     { FONT-SIZE: 22px; COLOR: #e85222; FONT-FAMILY: Arial; text-shadow: 1px 1px rgba(0, 0, 0, 0.4); TEXT-DECORATION: none; }
.logo:active    { FONT-SIZE: 22px; COLOR: darkblue; FONT-FAMILY: Arial; text-shadow: 1px 1px rgba(0, 0, 0, 0.4); TEXT-DECORATION: none; }


/*Линия в правой колонке*/
.hr  {  border-top:1px dashed black; width:100%; padding: 0 0 10 0; margin: 16 0 0 0;}

/*Линия в товаре*/
.hrs  {  border-top:1px solid black; width:100%; padding: 10 0 0 0;}

/*Линия в списке товаров*/
.hrsl  {  border-top:1px solid black; width:100%; padding: 0 0 10 0; margin: 10 0 0 0;}


/*Возможно для будущих колонок разного цвета*/
#container {
  float: left;
  width: 100%; 
  margin:0 auto;
  /*background-image: url("/img/1200x4.gif");   
  background-repeat: repeat-y; */
}

/*FLEXBOX*/
#container .innerflex { display: flex; flex-wrap: wrap; justify-content: space-between; }


#copyright {
  float: left;
  width: 100%; 
  margin:0 auto;
}
#copyright .inner  { FONT-SIZE: 12px; COLOR: #000000; FONT-FAMILY: Arial; padding: 0 0 10 0; margin: 10 0 0 0;}


/*Адаптивная страница товара*/
#image {
  float: left;
  width: 50%; 
  margin:0 auto;
}
#image .inner  { padding: 0 0 10 0;  }

#description {
  float: left;
  width: 50%; 
   margin:0 auto;
}
#description .inner  { FONT-SIZE: 14px; COLOR: #000000; FONT-FAMILY: Arial; text-align: left; padding: 0 4 0 4;  }

#model {
  margin:0 auto;
}

#submit {
  margin:0 auto;
  padding-top: 5px;
}



/*Адаптивная шапка*/
#logo {
  float: left;
  width: 33%;
 margin:0 auto;
}
#logo .inner  { FONT-SIZE: 14px; COLOR: #000000; FONT-FAMILY: Arial; line-height: 1.3; text-align: left; padding: 8 0 0 4;  }

#search {
  float: left;
  width: 34%;
  margin:0 auto;
}
#search .inner  { FONT-SIZE: 14px; COLOR: #000000; FONT-FAMILY: Arial; line-height: 1.3;  text-align: center; padding: 4 0 0 0;}

#phone {
  float: left;
  width: 33%;
 margin:0 auto;
}
#phone .inner  { FONT-SIZE: 14px; COLOR: #000000; FONT-FAMILY: Arial; line-height: 1.3;  text-align: right; padding: 4 4 0 0;}

#nav {
  float: left;
  width: 100%;
 margin:0 auto;
}
/* Скрываем пункт меню "Каталог товаров" */
#nav  .catalogmenu { display: none; } 


/*Адаптивные три колонки*/
#leftcol {
  float: left;
  width: 20%;
  max-width: 210px;
}
#leftcol .inner  { text-align: left; padding: 4 4 0 4;  }

#centercol {
  float: left;
  width: 65%;
  margin: 5;
}

#rightcol {
  float: right;
  width: 15%;
  max-width: 150px;
  margin: 0 4 0 0;
}
#rightcol .inner  {  FONT-SIZE: 14px; COLOR: #000000; FONT-FAMILY: Arial; text-align: left; padding: 0 0 0 4;  }



/* две таблицы на главной */
#left {
  float: left;
  width: 50%;
  margin: 0 0 10 0;
  padding: 0;
}

#right {
  float: right;
  width: 50%;
  margin: 0 0 10 0;
  padding: 0;
}



/* если ширина окна <= 1174px ... */
 /*открываем media query*/
@media screen and (max-width: 1174px) {
 
  /* Делаем ширину колонок слева и справа */
 
#leftcol {
  float: left;
  width: 21%;
  max-width: 210px;
}

#centercol {
  float: left;
  width: 63%;
  margin: 5;
}

#rightcol {
  float: right;
  width: 16%;
  max-width: 150px;
}

}
 /*закрываем media query*/


 /* если ширина окна <= 1108px ... */
 /*открываем media query*/
@media screen and (max-width: 1108px) {
 
  /* Делаем ширину колонок слева и справа */
 
#leftcol {
  float: left;
  width: 22%;
  max-width: 210px;
}

#centercol {
  float: left;
  width: 61%;
  margin: 5;
}

#rightcol {
  float: right;
  width: 17%;
  max-width: 150px;
}

}
 /*закрываем media query*/


  /* если ширина окна <= 1050px ... */
 /*открываем media query*/
@media screen and (max-width: 1050px) {
 
  /* Делаем ширину колонок слева и справа */
 
#leftcol {
  float: left;
  width: 23%;
  max-width: 210px;
}

#centercol {
  float: left;
  width: 59%;
  margin: 5;
}

#rightcol {
  float: right;
  width: 18%;
  max-width: 150px;
}

}
 /*закрываем media query*/




/* если ширина окна <= 998px ... */
 /*открываем media query*/
@media screen and (max-width: 998px) {
 
  /* Делаем таблицы друг под другом */
 
  #left {
    width: 100%;
  }
  #left .text  { FONT-SIZE: 12px; COLOR: #000000; FONT-FAMILY: Arial; TEXT-DECORATION: none }
 
  /* Переносим навигацию наверх сайдбара */
 
  #right {
    width: 100%;
  }
   #right .text  { FONT-SIZE: 12px; COLOR: #000000; FONT-FAMILY: Arial; TEXT-DECORATION: none }


#leftcol {
  float: left;
  width: 24%;
}


#centercol {
  float: left;
  width: 57%;
}

#rightcol {
  float: right;
  width: 19%;
}
 
}
 /*закрываем media query*/



   /* если ширина окна <= 950px ... */
 /*открываем media query*/
@media screen and (max-width: 950px) {
 
  /* Делаем ширину колонок слева и справа */
 
#leftcol {
  float: left;
  width: 25%;
  max-width: 210px;
}

#centercol {
  float: left;
  width: 55%;
  margin: 5;
}

#rightcol {
  float: right;
  width: 20%;
  max-width: 150px;
}

}
 /*закрываем media query*/

    /* если ширина окна <= 908px ... */
 /*открываем media query*/
@media screen and (max-width: 908px) {
 
  /* Делаем ширину колонок слева и справа */
 
#leftcol {
  float: left;
  width: 26%;
  max-width: 210px;
}

#centercol {
  float: left;
  width: 53%;
  margin: 5;
}

#rightcol {
  float: right;
  width: 21%;
  max-width: 150px;
}

}
 /*закрываем media query*/


     /* если ширина окна <= 834px ... */
 /*открываем media query*/
@media screen and (max-width: 834px) {
 
  /* Делаем ширину колонок слева и справа */
 
#leftcol {
  float: left;
  width: 27%;
  max-width: 210px;
}

#centercol {
  float: left;
  width: 51%;
  margin: 5;
}

#rightcol {
  float: right;
  width: 22%;
  max-width: 150px;
}

}
 /*закрываем media query*/


      /* если ширина окна <= 798px ... */
 /*открываем media query*/
@media screen and (max-width: 798px) {
 
  /* Делаем ширину колонок слева и справа */
 
#leftcol {
  float: left;
  width: 28%;
  max-width: 210px;
}

#centercol {
  float: left;
  width: 49%;
  margin: 5;
}

#rightcol {
  float: right;
  width: 23%;
  max-width: 150px;
}


#image {
  float: left;
  width: 100%; 
  margin:0 auto;
}

#description {
  float: left;
  width: 100%; 
  margin:0 auto;
}
#description .inner  { FONT-SIZE: 14px; COLOR: #000000; FONT-FAMILY: Arial; text-align: left; padding: 0 4 0 4;  }




}
 /*закрываем media query*/


      /* если ширина окна <= 768px ... */
 /*открываем media query*/
@media screen and (max-width: 768px) {
 
  /* Делаем ширину колонок слева и справа */
 
#leftcol {
  float: left;
  width: 29%;
  max-width: 210px;
}

#centercol {
  float: left;
  width: 47%;
  margin: 5;
}

#rightcol {
  float: right;
  width: 22%;
  max-width: 150px;
}

}
 /*закрываем media query*/


       /* если ширина окна <= 740px ... */
 /*открываем media query*/
@media screen and (max-width: 740px) {
 
  /* Делаем ширину колонок слева и справа */
 
#leftcol {
  float: left;
  width: 30%;
  max-width: 210px;
}

#centercol {
  float: left;
  width: 45%;
  margin: 5;
}

#rightcol {
  float: right;
  width: 25%;
  max-width: 150px;
}

}
 /*закрываем media query*/


        /* если ширина окна <= 712px ... */
 /*открываем media query*/
@media screen and (max-width: 712px) {
 
  /* Делаем ширину колонок слева и справа */
 
#leftcol {
  float: left;
  width: 31%;
  max-width: 210px;
}

#centercol {
  float: left;
  width: 43%;
  margin: 5;
}

#rightcol {
  float: right;
  width: 26%;
  max-width: 150px;
}

}
 /*закрываем media query*/


         /* если ширина окна <= 688px ... */
 /*открываем media query*/
@media screen and (max-width: 688px) {
 
  /* Делаем ширину колонок слева и справа */
 
#leftcol {
  float: left;
  width: 32%;
  max-width: 210px;
}

#centercol {
  float: left;
  width: 41%;
  margin: 5;
}

#rightcol {
  float: right;
  width: 27%;
  max-width: 150px;
}

}
 /*закрываем media query*/


          /* если ширина окна <= 668px ... */
 /*открываем media query*/
@media screen and (max-width: 668px) {
 
  /* Делаем ширину колонок слева и справа */
 
#leftcol {
  float: left;
  width: 33%;
  max-width: 210px;
}

#centercol {
  float: left;
  width: 39%;
  margin: 5;
}

#rightcol {
  float: right;
  width: 28%;
  max-width: 150px;
}

}
 /*закрываем media query*/


           /* если ширина окна <= 646px ... */
 /*открываем media query*/
@media screen and (max-width: 646px) {
 
  /* Делаем ширину колонок слева и справа */
 
#leftcol {
  float: left;
  width: 34%;
  max-width: 210px;
}

#centercol {
  float: left;
  width: 36%;
  margin: 5;
}

#rightcol {
  float: right;
  width: 30%;
  max-width: 150px;
}

}
 /*закрываем media query*/



/* если ширина окна <= 639px ... */
 /*открываем media query*/
@media screen and (max-width: 639px) {
 
#logo {
  float: left;
  width: 100%;
 margin:0 auto;
}
#logo .inner  { FONT-SIZE: 14px; COLOR: #000000; FONT-FAMILY: Arial; line-height: 1.3; text-align: center;  }

#search {
  float: left;
  width: 100%;
  margin:0 auto;
}
#search .inner  { FONT-SIZE: 14px; COLOR: #000000; FONT-FAMILY: Arial; line-height: 1.3;  text-align: center; }

#phone {
  float: left;
  width: 100%;
 margin:0 auto;
}
#phone .inner  { FONT-SIZE: 14px; COLOR: #000000; FONT-FAMILY: Arial; line-height: 1.3;  text-align: center; } 

#nav .menu:link      {  }
#nav .menu:visited   {  }
#nav .menu:hover     {  }
#nav .menu:active    { }

/* Открываем пункт меню "Каталог товаров" */
#nav  .catalogmenu { display: inline; } 
/* Скрываем пункты меню */
#nav  .aboutmenu { display: none; } 
#nav  .testimonialsmenu { display: none; } 



#leftcol {
  float: left;
  width: 100%;
  margin:0 auto;
  max-width: 100%;
  display: none;
}
#leftcol .inner  { text-align: left; padding: 4 4 0 4;  }

#centercol {
  float: left;
  width: 100%;
  margin:0 auto;
  max-width: 100%;
}
#centercol .inner  { text-align: left; padding: 0 4 0 4;  }

#rightcol {
  float: left;
  width: 100%;
  margin:0 auto;
  max-width: 100%;
}
#rightcol .inner  { text-align: left; padding: 4 4 0 4;  }


.ltmenu:link    { line-height: 2; }
.ltmenu:visited { line-height: 2; }
.ltmenu:hover   { line-height: 2; }
.ltmenu:active  {  line-height: 2; }

#testimonials .inner  { padding: 0 0 10 0;  }

#contactcontainer .inner  { padding: 0 4 0 4;  }


}
 /*закрываем media query*/



/* Кнопка скролла*/
#scroller{
    position: fixed;    
    /** позиция кнопки scroll to top **/
	bottom: 16px;
    left: 49%;
    /** картинка кнопки наверх**/
    background: transparent url('/img/arrow.png');  
    width: 32px;
    height: 32px;
    /** скругляем углы серого фона **/
    border-radius: 6px;
    /** скрываем кнопку в начале **/
    display:none;
    /** добавляем красоты- прозрачность и плавное проявление при наведении **/
    opacity: 0.5;
    -webkit-transition:all .2s ease-in-out;
    transition:all .2s ease-in-out
    }
    #scroller:hover {
    /** при наведении мыши делаем все ярче и отбрасываем тень **/
    opacity: 1.0;
    box-shadow: 1px 1px 5px rgba(0,0,0,0.5);
}