﻿/* CSS Document */
/*-----------------------
Основные элименты
-------------------------*/
body {font-size:1em;font-family: Arial, Tahoma, Verdana; padding: 0px;margin-top:0; background:#e8e8e8}	
img {border:none;}	
a {text-decoration:none;}
ul {margin:0;}
/*------------------------------
Задаем ширину картинки (зависит от размера экрана) см. в конц

оформляем шапку 
------------------------------------*/

header{height:135px;max-width: 1920px; background:url(../img/head.jpg) no-repeat left top, url(../img/fon.gif);background-size:contain} 

/*header .hright {text-align:right;font-size:1.4em; padding-top:10px; color:#2c3d70; font-weight:bold;margin: 0px auto 0px; max-width:1600px; }
header .hright dir {font-size:.6em; }
header .hright dir span {color:#6699cc; font-weight: 100} */

header .hright{texy-align:right}

header .seach {position:absolute; top:100px; right:20px}
header .corf {
  position: absolute;  top: 75px;  right: 28px;
  width: 158px;  height: 79px;
  text-align: center;
  color:#2c3d70;
  font-weight: bold;
  font-size: 1.1em;
}
header .corf .outcrf {margin-top:10px; font-size: 0.8em !important}
header .smfn{display:none}
/*.socnet {text-align:center; margin-bottom:10px;}*/
/*------------------------------*/
/*--- Оформляем основное меню
------------------------------*/
nav.nmain {widh:100%;margin-top:0px;background:#2c3d70; color:#ffffff; padding:8px;text-align: center}
.nmain a {color:#ffffff; font-weight:bold;padding:5px 25px; position:relative;z-index:5}
.nmain a:hover {padding:5px 25px; background-color:#C4DC3F;}	
.nmain a.current {color:aqua}
/*--------------------------------------------
Основная часть
---------------------------------------------*/
.wrapper { max-width:1600px; position:relative; margin: 0px auto 0px;}
.content {margin-top:30px; padding:0px; overflow: hidden;position:relative;}	

/*-----------------------------------
Левое меню
------------------------------------*/
.left { width: 320px; float:left  }
 .cmenu {background:#2c3d70;color:#ffffff; padding:7px 5px 7px; font-weight:bold; font-size:.85em; margin-left:-40px;  }
.lmenu li {list-style-type:none}
.lmenu li a{color:#585858; font-size:1em; margin-left:0px; }
.lmenu li a:hover {padding-left:5px;}
.lmenu  a.carrent {font-weight:bold}	
.imgl {list-style-image:url(../img/arrow-right.png);}
.imgd {list-style-image:url(../img/arrow-down.png)}
.lmenu ul.link_0{list-style-image:url(../img/arrow-right.png); margin-left:-60px;}
.lmenu .link_0 {margin:10px 0 10px;  }
.lmenu .link_1, .lmenu .link_2  {margin-left:-20px;  }
/*--------------------
wrapin
----------------------*/
/*.wrap  {background:#D5BBAA;}
.wrapin h3 {color: #4F2E08; font: bold 1.8em "Comic Sans MS", cursive;text-shadow:1px 1px 1px #ffffff; padding-left:20px; padding-top:10px;}*/
/*-------------------
Основная часть
---------------------*/
.content .middle {width:1200px; float:right; border-left:solid 2px #ffffff; margin-top:0px; background-color:#ffffff}
.content article {padding:0px 10px}
.content article .drink {background:url(../img/shesterenka2.gif) no-repeat right bottom}

article a {color: #CE6700; font-size:0.85em; font-weight:bold; }		
article a:hover { text-decoration:underline;}
article .imgfrm > img {margin:5px 25px; float:left;}
/*article .artic {margin-right:20px; float:left; font-size:0.85em;}*/
article .arow {font-size:0.85em;color:#2a4a56; font-weight:normal; font-style:italic;padding-top:10px}
article .arow a {color:#2a4a56; font-weight:normal; font-style:italic;font-size:1em;}
/* article .arow {background-color:#dfe2e2; padding:5px 10px;}*/
/*-----------------------------
Вывод описания одной покупки
----------------------------------*/
section .drink20{margin: 20px 0}
.arow + hr {background-color:#dfe2e2; color:#dfe2e2;border: none; height: 2px;/* Цвет линии */}
.imgmain { float:left; margin:10px 30px 10px 10px;border: none;} /*border-radius: 6px;border:#8a7d6c 2px outset; box-shadow:5px 5px 5px #565b4b;}*/
.ervol {color:#f00; font-size:2em;}
.drchec {float:left; margin:-2px 0 0 20px;}
.drvr {margin-top:10px; display:table}
.dtfrm  input {background-color:inherit;border:none;cursor:pointer; margin-top:10px; margin-left:20px; text-decoration:underline; font-size:1em;}
.lft {float:left}
.mlft {margin-left:20px;}
.mrght {margin-right:20px;}
.mtp20 {margin-top:20px}
.bld {font-weight:bold;}
.w115 {width:145px}
.w110 {width:130px}
.w180 {width:180px}
.w250 {width:250px}
.w620 {width:660px;}
.w24 {width:20%}
.w48 {width:32%}
.w50 {width:50%}
.w60 {width:63%}
.w75 {width:80%}
.rght {float:right;}
.widths {max-width:400px;}
.heights {max-height:300px;}
.heightd {height:300px;}
.widthd { width:225px;}
.ccc {color: #999;}
.red {color:#F00;}
.trght {text-align:right}
.cntr {text-align:center}
.tlft {text-align:left}
.block {display:block}
.ifrm {width:560px; height:315px}
.bbrdr {border-bottom: 1px solid #000}
.bgg {background-color:#cccccc}
/*------------------------------
Вывод по четыре
-----------------------------*/	
.table { overflow:hidden;	display: inline-block; 	width: 100%; 	text-align: center;}
.table h4 {font-size:0.9em;	height:auto; margin: 5px auto;	background-color:#2c3d70; background-size: cover; padding: 5px 20px;  border-radius: 4px; text-align: left;	color: #e8e8e8}
.outheight {height:21.0em}
.table section{	float: left; width: 24%; 	margin: 5px 0 0 4px; 	font-size:0.9em; 	color: #000;	border-radius: 4px; 	border: #8a7d6c 1px solid; 	background-color: #FFF; 	padding: 5px 1px; 	height: 19.6em}
.table section .img4 {height: 15.5em; overflow:hidden; font-weight:normal; font-style:italic}	
.table section i{white-space: normal}
.table section .img4 div {position: relative;height: 9.5em; }
.table section .img4 div img {max-width: 200px;max-height:9.4em; margin:auto;}	
.table section .img4  h5 {font-size:1.1em; margin-bottom:5px; font-style:normal;}
.table section .img4 .new {position:absolute;left:0%}
.table section .img4 .action {	position: absolute; left:100%; margin-left:-60px;}
.table a{color: #333; 	text-decoration: none; 	font-size:1.01em;}	
.table a:hover strong{ 	text-decoration: underline;}	
.table a strong i {	color: #CE6700; font-size: 1em; 	font-weight: bold;}	.navpage + a b i {float:left; margin-top:10px;}			
.table a:hover strong i { 	text-decoration: underline;}	
.prc { font-style:italic;	font-size: 1.2em; 	color: #FB0000;  	font-weight: bold; display:inline-block}
.tdec {text-decoration: line-through;}
/*-----------------------------------
вывод числа страниц
--------------------------------------*/
.navpage { 	padding:0px; float:right; margin-bottom:5px; }	
.navpage a {color: #333; text-decoration:none; padding:2px 5px; border: #FFF 2px outset; }
.navpage a:hover {color:#B16565;  text-decoration:underline;}	
.navpage a.current {color: #F00;}	
/*--------------------------------------------
Оформляем ввод пароля
---------------------------------------------*/
.login { margin:30px 0 0 20px;padding:5px 10px; width:300px; }
.login input {width:300px; height:auto;}	
.login input[type="submit"] { width:70px;; margin:5px 5px; font-size:1em; float:left;height:auto;}
.login .alog { text-decoration:underline; float:left; margin-left:50px; margin-top:7px;font-size:1em; }
/*----------------------------
/*-----------------------------------
Новости
----------------------------------------*/
aside {width:240px; margin-right:8px;  float:right; padding-top:30px;}
/*----------------------------------------
Вывод корзины
---------------------------------------------*/
table.corft {
  table-layout: fixed;
  width: 98%;
  margin-bottom: 10px;
  background-color: #fff;
}
.corft th{border-bottom: 1px solid #999}
.corft td{vertical-align:middle;text-align:right;border-bottom: 1px solid #999}
.corft td.cntr {text-align:center}
.corft th{vertical-align:middle;text-align:center;background-color:#EEF0AE }
.corft tr.cbg {background-color:#EEF0AE;text-align:right}
.corft td.tdimg {text-align:left;  max-height: 130px;  max-width: 130px;}
.corft td.tdimg div {  float: left;  padding-right: 5px}
.corft a img {  display: block;  margin: auto}
.corft input {
  background-color: #FF8080;
  text-align: center;
}
.corft input[type="number"], .corftab select {
  width: 32px;
}
table.corft + input[type="submit"] {
  display: none;
}
.corft .delimg input {
  background: url(../img/delete.png) no-repeat 0 5px;
  border: none;
  cursor: pointer
}
.corfn {padding-bottom:20px}
nav.corfn {
  margin-top: 7px;
  margin-right: 120px;
  float: right;
}
.corfn a {
  color: #820000;
  background-color: #999;
  font-weight: bolder;
  border: 1px double #ffffff;
  border-radius: 5px;
  padding: 8px 20px 10px;
}
.corfn a:hover {
  background-color: #820000;
  color: #CCC;
}
/*-------------------------------------
Вывод формы реквизитов покупателя
--------------------------------------*/
.usform {width:65%;}
.usformr {width:30%; float:right; margin-top:-400px;}
.usformr {padding:15px;  }
.usform input, .usform select{width:60%; float:right;}
/*#usform input[type="email"]{width:40%;}*/
.usform	input[type="submit"] {width: inherit;}
/*------------------------------------------------------
Таблица покупок пользователя
------------------------------------------------------------*/		
div.orderl {	height: 15px; 	background-color: #9BDEFF; 	margin-top: 8px; 	padding: 10px 15px;}
.orderl span, .sumend span {	margin-left: 100px;} 
.orderl + table {	border-collapse: collapse; 	width: 100%; 	border: thin solid #999; 	table-layout: fixed;}
.orderl + table tr.inw {	background-color: #DADADA;}
.orderl + table tr > td {	text-align: center;}	
.orderl +table  td, .orderl +table  th {	border: thin solid #999;}
.orderl +table td.rb {	text-align: right; 	padding-right: 8px;}
.orderl +table td.tdimg {	height: 130px; 	width: 130px; 	margin: auto;}
.orderl +table img{	max-height: 130px; 	max-width: 130px; 	float: left; 	margin-right: 10px; 	border-radius: 5px;}
.orderl +table td div {	text-align: center;}
.sumend {	height: 15px; 	background-color: #004284; 	color: #FFF; 	margin-top: 8px; 	padding: 10px 15px;}
/*---------------------------------
sendmail
-------------------------------------*/
fieldset {display:table; background-color: #dbeaf0; font-weight:normal; font-size:1.1em;margin-top:20px}
fieldset label {float:left; 	padding:4px 10px 0;}
fieldset input {float:left;}
fieldset p { text-align: center;}
.regard1 {margin-top:20px;}
.regard1 label {float:left;width:250px;}
.regard1 img {float:left;width:150px; }
.regard1 input {float:left;margin-left:20px;}
#posText, #posName, #posEmail{ width:98%;}
#keystring {width:20%}


/*------------------------------------------------------
Таблица
-------------------------------------------------------*/
table {
  border-collapse: collapse !important;border: 1px solid #444;
  border-spacing: 0;background-color:#fff5ee;
  font-size:14px;width:100%}
td,th {
  border: 0;
  border-left: 1px solid #444;	
  padding: 0.4em 0.4em;
  vertical-align: top;}
td {font-weight: normal;}
th {font-weight:bold;text-align:left}
.col{background-color:#c9c9c9}
.hd th {border-bottom:1px solid #444;font-size:14px;background-color:#808080; text-align:center}
/*-----------------------------------------------------------------------*/
@media only screen and (min-width: 1400px) and (max-width: 1629px) {
header {height:101px }	
header h1 {font-size:1.45em; font-weight:bolder;  }
header .hiuser {top:115px; right:130px; font-size:0.9em}
header .corf {top:12px; right:18px; }
header form.seach {top:76px}	
nav a {font-size:0.9em;}
.wrapper {max-width:1400px;}
.left {width:300px}
.content .middle {width:1000px;} 	
.table section{width: 24%;height: 19.6em}
.outheight {height:21em}
.table section .img4 {height: 15.5em}	
.login input {width:250px; height:20px;}
}	
@media only screen and (min-width: 1100px) and (max-width: 1399px) {
/* ----------------------------------
оформляем шапку 
------------------------------------*/
header {height:90px }	
header form.seach {top:66px}		
header h1 {font-size:1.4em;}
header .corf {top:10px; right:10px; width:128px;font-size:0.8em; background-size:32%;  height: 69px;}
header .corf .outcrf{font-size:1.25em;}
header .corf .outcrf span {font-size:1.0em;}
header .hiuser {top:128px; right:100px; font-size:.9em;}
/*------------------------------
Оформляем основное меню
------------------------------*/
nav {margin-top:62px; }
nav a {font-size:0.89em; padding:5px 15px;}
/*--------------------------------------------
Основная часть
---------------------------------------------*/
.wrapper {max-width:1100px;}
.content .left {width:200px}		
.content .middle {width:850px;} 
/*-----------------------------------
Левое меню
------------------------------------*/	
.left a{ font-size:0.74em; margin-left:-5px;}
/*--------------------------------------
Вывод по четыре
---------------------------------------*/	
.table section{width:31%;height: 19.6em}
.outheight {height:21em}
.table section .img4 {height: 15.5em}	
.table a b i {font-size: 0.9em;}	
.w24 {width:23.8%;}
.w48 {width:31.7%;}
.w620 {width:540px;}

aside {width:188px; margin-right:0px;  float:right;}
/*-----------------------------------
Новости
----------------------------------------*/
.tlft { width:60%}
.corftab { padding-bottom:40px;}
.login input {width:200px; height:20px;}
.login .alog{margin-left:25px;}
}
@media only screen and (min-width: 900px) and (max-width: 1099px) {
/* ----------------------------------
оформляем шапку 
------------------------------------*/	
header {height:75px }	
header form.seach {top:50px}		
header h1 {font-size:1.4em;}
header .corf {top:7px; right:10px; width:128px;font-size:0.8em; background-size:32%;  height: 60px;}
header .corf .outcrf{font-size:1.25em;}
header .corf .outcrf span {font-size:1.0em;}
/*------------------------------
Оформляем основное меню
------------------------------*/
nav {margin-top:42px; }	
nav a {font-size:0.8em; padding:5px 15px;}
/*---------------------------*/
.wrapper {max-width:900px;}
.content .left {width:180px}		
.content .middle {width:670px;} 
/*-----------------------------------
Левое меню
------------------------------------*/
.lmenu a {font-size:0.58em;margin-left:-5px; }
/*--------------------------------------
Вывод по четыре
---------------------------------------*/
.table section{width:31.6%;height: 17.6em}
.outheight {height:19.2em}
.table section .img4 {height: 15.5em}
.table a {font-size: 0.9em;}
.table a b i {font-size: 0.9em;}
.usform {width:100%;}
.usformr{ display:none;}
}
@media only screen and (min-width: 610px) and (max-width: 899px) {
/* ----------------------------------
оформляем шапку 
------------------------------------*/
header {height:75px }	
header form.seach {top:50px}		
header h1 {font-size:1.4em;}
header .corf {top:7px; right:10px; width:128px;font-size:0.8em; background-size:32%;  height: 60px;}
header .corf .outcrf{font-size:1.25em;}
header .corf .outcrf span {font-size:1.0em;}
/*----------------------------	
Оформляем основное меню
------------------------------*/
nav {margin-top:42px; }	
.nmain a {font-size:0.8em; padding:5px 14px}
/*---------------------------*/
.wrapper {max-width:600px;}
.content .left {width:180px}		
.content .middle {width:400px;} 
/*-----------------------------------
Левое меню
------------------------------------*/
.other img {max-width:114px;}
/*---------------------------------
--------------------------------------*/
.ifrm {max-width:385px;}
/*--------------------------------------
Вывод по четыре
---------------------------------------*/
.table section{width:47.5%;height: 19.6em}
.outheight {height:21em}
.table section .img4 {height: 15.5em}
.table section .img4  h5 {font-size:1em}	
.table a b i {font-size: 0.9em;}
.corftab img{display:none;}
.ervol {font-size:1.7em;}
.widths {max-width:200px;}
.heights {max-height:150px;}
.corftab {font-size: 0.8em;}
.usform {width:100%;}
.usformr{ display:none;}
}
@media only screen and (min-width: 450px) and (max-width: 611px) {
header {height:75px}	
header form.seach {top:49px;right:20px}	
header .smfn {display:inline}	
header .smfn a img {position: absolute; top:8px; right:20px}
header .corf {top:7px; right:10px; width:153px;font-size:0.8em; background-size:25%;  height: 50px;}
header .corf .outcrf{font-size:1.em;margin-top:7px}
header .corf .outcrf span {font-size:1.0em;}
/*------------------------------
Оформляем основное меню
------------------------------*/
nav {margin-top:42px;padding: 2px 0 5px 0 !important }	
.nmain a:hover,.nmain a {font-size:0.75em; padding:0 20px}	
/*---------------------------*/
.wrapper {max-width:100%}
.content .left {display:none}		
.content .middle {width:100%} 
.content {margin-top:23px; }	
.content article .corftab {padding-bottom:55px;}
.middle  .lmenu {width:80%;margin:auto} 
	
.table section{width:30.8%;height: 19.6em}
.outheight {height:21em}
.table section .img4 {height: 15.5em}
.table section .img4  h5 {font-size:1em}
.table section .img4 div img {max-width:150px}	

.corftab th, .corftab td {font-size:0.9em; padding:2px 3px;}
.corftab .tdimg img {display:none;}
.ervol {font-size:1.65em;}
.ifrm {max-width:370px;}
.widths {max-width:200px;}
.heights {max-height:150px;}
.usform {width:100%;}
.usformr{ display:none;}
}
@media only screen and (max-width: 449px) {
header {height:75px}	
header form.seach {top:49px;right:8px}		
header .smfn {display:inline}	
header .smfn a img {position: absolute; top:8px; right:20px}
header .corf {top:27px; right:10px; width:119px;font-size:0.8em; background-size:0%;  height: 40px;}
header .corf .outcrf{font-size:1.em;margin:7px 7px 0 0px;}
/*header .corf .outcrf span {font-size:1.0em;}
/*------------------------------
Оформляем основное меню
------------------------------*/
nav {margin-top:42px;padding: 2px 0 5px 0 !important}	
.nmain a:hover,.nmain a {font-size:0.64em; padding:0px 20px}	
/*------------------------------------------*/	
.wrapper {max-width:100%}
.content {margin-top:23px; }	
.content .left {display:none}	
.content article .corftab {padding-bottom:55px;}	
.content .middle {width:100%} 	
.middle .lmenu {width:87%;margin:auto}
/*-----------------------------------
Левое меню
------------------------------------*/
.table section{width:46.8%;height:20.9em}
.outheight {height:22.4em}
.table section .img4 {height: 16.5em}
.table section .img4  h5 {font-size:1em}
.table section .img4 div img {max-width:150px;max-height:9.4em}	
.table a b i {font-size: 0.9em;}
.corftab th, .corftab td {font-size:0.9em; padding:2px 3px;}
.corftab .tdimg img {display:none;}
.ervol {font-size:1.45em;}
.ifrm {max-width:335px;}
.widths {max-width:200px;}
.heights {max-height:150px;}
.usform {width:100%;}
.usformr{ display:none;}
}