@media screen and (min-device-height: 720px), all and (not handheld)  {body, html {background: url("images/bgs.jpg") #1653b0 top left repeat-x;}}
@media screen and (min-device-height: 800px), all and (not handheld)  {body, html {background: url("images/bgm.jpg") #1653b0 top left repeat-x;}}
@media screen and (min-device-height: 1024px), all and (not handheld) {body, html {background: url("images/bg.jpg") #1653b0 top left repeat-x;}}
@media handheld and (min-width: 20em), screen and (orientation: portrait) {body, html {background: url("images/bg.jpg") #1653b0 top left repeat-x;}}
/*@media handheld and (min-width: 20em), screen and (min-width: 20em) {body, html {background: url("images/bg.jpg") #1653b0 top left repeat-x;}}
*/



body, html {
	margin:0px;
	padding:0px;
	width:100%; 
	height:100%;
	background-color:#1653b0;
	/*background: url("images/bg.jpg") #1653b0 top left repeat-x;*/
	color:#fff;
	font-size: 14px;
	font-family: Verdana, Geneva, sans-serif;
	text-align:center;
}

a {text-decoration:none; color:#ebf4fa;}
a:hover {text-decoration:underline;}
a img {border-width:0px;}

h1 {font-family: "Times New Roman"; font-size:25px; margin:5px 0px 0px 0px; }
h2 {font-family: "Times New Roman"; font-size:20px; font-weight:normal; color:#fff; margin:20px 0px; text-transform:uppercase;}
h3 {font-family: "Times New Roman"; font-size:18px; font-weight:normal; margin:0px; color:#ebf4fa;}


#content {
	width:960px;
	margin:0px auto;
	text-align:justify;
}

#header {
	width:960px;
	height:112px;
	padding-top:10px;
}

#logo {
	float:left;
	margin:5px 0px;
}

#logo a {
	color:#FFF;
	font-size:30px;
	font-weight:bold;
	font-family: "Times New Roman";
	text-decoration:none;
}

#search {
	float:left;
	margin: 75px 0px 0px 70px;
}

.search-input {
	width:210px;
	height:23px;
	border: 1px solid #CCCCCC;
	border-radius: 3px 3px 3px 3px;	
}

#tel {
	float:right;
	margin-top:3px;
	color:#F3F1A2;
	font-size:20px;
	text-align:right;
	width:350px;
}

.slogan {
	float:right;
	color:#D3E8FF;
	font-size:21px;
	line-height:20px;
	font-family: Helvetica;
	text-align:right;
	width:400px;
	margin:6px 0px 0px 0px;
}

#slider {margin-bottom:20px;}

#main {
	background: url("images/bgmain.png") top left repeat-y;
	padding:5px;
	border-radius:6px;
	-webkit-border-radius: 6px;
    -moz-border-radius: 6px; 
}

#mleft {
	float:left;
	margin:10px;
	width:300px;
}

#mright {
	float:right;
	margin:10px;
	width:610px;
	color:#ebf4fa;
}

.leftmenu {	padding-left:0px; list-style-type:none;}
.leftmenu li {margin:10px;}
.leftmenu li a {color:#ffcf7e;}

.litem {
text-transform:uppercase;
font-weight:bold;
padding-left:22px;
}

.soffer p {
	font-size:12px;
	margin:6px 0px;
	text-align:justify;
}

.soffer a {
	color:#ffce7a;
	font-weight:bold;
	font-size: 14px;
	text-decoration:underline;
}

.soffer a:hover {
	text-decoration:none;
}

.preview {
	float:left;
	margin:0px 20px 10px 0px;
}

.blink {
	color:#adffff!important;
	font-size:12px!important;	
}

.prevprice {
	font-size:16px;
	font-weight:bold;
	float:left;
	color:#ffce7a;
}

#footer {
	padding:10px 0px 15px 0px;
	background-color:#134e94;
	background-image: none;
	margin-top: 30px;
	height: 35px;
	border-top: 1px #aaa solid;
}

#intfooter {
	width:960px;
	margin:0px auto;
	color:#e9e9e9;
	font-size:11px;
	line-height:12px;
	font-style:normal;
	font-weight:normal;
	text-decoration:none;
}

#intfooter  p{margin:5px;}
#intfooter  a{color:#e9e9e9; text-decoration:none;}

.tbl-item {
	width:200px;
	border:1px solid #9bbdee;
	margin:10px 1px;
}

.tbl-top-item {
	text-align:center;
	font-weight:bold;
	margin-bottom:8px;
	font-size:14px;
}
.tbl-top-item a {color:#ffd68f;}

.tbl-center-item {
	color:#FFD081;
	text-align:center;
	font-size:12px;
	margin:5px 0px 0px 0px;	
}

.tbl-btm-item {
	text-align:center;
	margin:0px 0px 20px 0px;
	font-weight:bold;
}
.tbl-btm-item  a {color:#adffff;}


.bluebrd {border:1px solid #9bbdee;}


.absent{
	font-family:"Times New Roman"
	font-weight:bold;
	font-size:20px;	
	color:#FFCF7E;
}

.buy {
	margin-top:10px;
	margin-bottom:0px;
	text-align:left;
	float:right;
}

.stext{
	float:right;
	width:200px;
	text-align:left;
	margin:0px 0px 0px 7px;
	overflow-y: auto;
}
.stext p {margin:3px 0px;}

.aftertext {
	margin-top:20px;
}

.aftertexttbl {
	font-size:9px;
	font-weight:bold;
	text-align:center;
	color:#444;
}
.aftertexttbl th {background-color:bdbec1; height:25px;}

.catalog-item {
	float:left;
	width:278px;
	height:135px;
	margin:5px 5px;
	padding:5px 0px 5px 15px;
	border:1px solid #ebf4fa;
	border-radius:5px;
	background: url("images/bgmain.png") top left repeat-x;
	overflow-y : auto;
}
.catalog-item img {margin-right:10px; margin-top:-5px;}
.catalog-item  h2 {margin:5px;}


.tleft {text-align:left;}
.odd  {background-color:e7e7e8;}
.even  {background-color:ffc20a;}

.title {
	color:#ebf4fa; /*ffdb9e*/
	font-family: "Times New Roman";
	font-size:18px;
	font-weight:normal;
	text-transform:uppercase;
}

.price {
	font-size:18px;
	font-weight:bold;
	text-align:right;
	color:#ffc300;
	float:left;
}

.oldprice {
	text-decoration:line-through;
	font-size:16px;
	font-weight:bold;
	color:#c0d9fa;
	margin-top:8px;
	margin-right:30px;
	float:left;
}

.discount {
	font-size:18px;
	font-weight:bold;
	color:#ffc300;
	background-color:#f00;
	margin:-252px 0px 0px -10px;
	padding:5px;
	height:22px;
	position:absolute;
	z-index:1;
	border-radius:5px;
	-webkit-border-radius: 5px;
    -moz-border-radius: 5px; 	
}

.discountlist {
	font-size:14px;
	font-weight:bold;
	color:#ffc300;
	background-color:#f00;
	margin:-152px 0px 0px 0px;
	padding:3px;
	position:absolute;
	z-index:1;
	border-radius:3px;
	-webkit-border-radius: 3px;
    -moz-border-radius: 3px; 	
}


.tbl-btm-itm-oldprice {
	text-decoration:line-through;
	text-align:center;
	font-size:14px;
	color:#aaa;
	margin:0px;
	padding:0px;

}


.sproduct {
	float:left;
	margin:0px 2px;
	padding:0px;
	text-align:center;
	font-size:12px;
}


.carttbl {
	font-size:14px;
	border-color:#9bbdee;
}
.carttbl th {padding:5px 15px;}
.carttbl td img {padding:2px;}

.qtyinput {
	width:30px;
	border-radius:3px;
	border:1px solid #ccc;
	text-align:center;
}

.orderinput {
	width:100%;
	border-radius:3px;
	border:1px solid #ccc;
}

.delivery-logo {
	width:118px;
	height:100px;
	margin:1px;
	float:left;
	border:1px solid #ebf4fa;
	border-radius:10px;
	background: url("images/delivbg.png") #DDE5F3 top left repeat-x;
}

.brand-logo {
	width:80px;
	height:40px;
	margin:0px 3px 5px 2px;
	float:left;
	border:1px solid #ebf4fa;
	border-radius:4px;
	background: url("images/brandbg.png") #DDE5F3 top left repeat-x;
}

.brand-logo-panel {
	margin:20px 0px 10px 0px;
}

.fleft {float:left;}
.fright {float:right;}
.clr {clear:both;}
.cntr {text-align:center;}




/*------------------------------------*\
	НАВИГАЦИЯ
\*------------------------------------*/
.nav{
	text-transform:uppercase;
	background: url("images/bgmenu.png") center center no-repeat;
	margin:0 auto 18px;
	padding:0px 0px 0px 15px;
	height:46px;
	font-size:14px;
	list-style:none;
	font-weight:bold;
	position:relative;
	z-index:100;
}
.nav li{
	float:left;	
	padding:15px 22px;
	position:relative;
	display:block;
}
.nav li a{
	display:block;
	padding:0px;
	text-decoration:none;
}
.nav li a:hover{
	color:#00031c;
}

/*--- ВЫПАДАЮЩИЕ ПУНКТЫ ---*/
.nav ul{
	padding:0;
	border-radius:6px;
	list-style:none;
	position:absolute;
	left:-9999px; /* Скрываем за экраном, когда не нужно (данный метод лучше, чем display:none;) */
	opacity:0; /* Устанавливаем начальное состояние прозрачности */
	-webkit-transition:0.25s linear opacity; /* В Webkit выпадающие пункты будут проявляться */		
}
.nav ul li{
	float:none;
	padding:0px;
	position:relative;
	z-index:101;
}
.nav ul a{
	white-space:nowrap; /* Останавливаем перенос текста и создаем многострочный выпадающий пункт */
	display:block;
	text-align:left;
	padding:6px 10px;
}
.nav li:hover ul{ /* Выводим выпадающий пункт при наведении курсора */
	left:0; /* Приносим его обратно на экран, когда нужно */
	opacity:1; /* Делаем непрозрачным */
}

.nav li:hover ul a{ /* Изменяем некоторые стили верхнего уровня при выводе выпадающего пункта */
	text-decoration:none;
	-webkit-transition:-webkit-transform 0.075s linear;
}

.nav li.active a{ /* Темно-синий цвет для активного пункта меню */
	text-decoration:none;
	color:#111;
}

.nav li.notactive a{ /* Серый цвет для неактивного пункта меню */
	text-decoration:none;
	color:#7d92b2;
}

.nav li.notactive a:hover{ /* Голубой цвет для неактивного пункта меню при наведении мыши */
	text-decoration:none;
	color:#8DB0E2;
}

.nav img {
	display:block;
	float:left;
	margin-top:2px;
}



.coleb {
-webkit-animation: swinging 15s ease-in-out 0s infinite;
-moz-animation: swinging 15s ease-in-out 0s infinite;
animation: swinging 15s ease-in-out 0s infinite;
-webkit-transform-origin: 50% 0%;
-moz-transform-origin: 50% 0;
transform-origin: 50% 0;
border-radius:3px;
}
 
@keyframes swinging{
0% { transform: rotate(0); }
5% { transform: rotate(12deg); }
10% { transform: rotate(-10deg); }
15% { transform: rotate(9deg); }
20% { transform: rotate(-8deg); }
25% { transform: rotate(7deg); }
30% { transform: rotate(-6deg); }
35% { transform: rotate(5deg); }
40% { transform: rotate(-4deg); }
45% { transform: rotate(3deg); }
50% { transform: rotate(0); }
100% { transform: rotate(0); }
}
 
@-webkit-keyframes swinging{
0% { -webkit-transform: rotate(0); }
5% { -webkit-transform: rotate(12deg); }
10% { -webkit-transform: rotate(-10deg); }
15% { -webkit-transform: rotate(9deg); }
20% { -webkit-transform: rotate(-8deg); }
25% { -webkit-transform: rotate(7deg); }
30% { -webkit-transform: rotate(-6deg); }
35% { -webkit-transform: rotate(5deg); }
40% { -webkit-transform: rotate(-4deg); }
45% { -webkit-transform: rotate(3deg); }
50% { -webkit-transform: rotate(0); }
100% { -webkit-transform: rotate(0); }
}
 
@-moz-keyframes swinging{
0% { -moz-transform: rotate(0); }
5% { -moz-transform: rotate(12deg); }
10% { -moz-transform: rotate(-10deg); }
15% { -moz-transform: rotate(9deg); }
20% { -moz-transform: rotate(-8deg); }
25% { -moz-transform: rotate(7deg); }
30% { -moz-transform: rotate(-6deg); }
35% { -moz-transform: rotate(5deg); }
40% { -moz-transform: rotate(-4deg); }
45% { -moz-transform: rotate(3deg); }
50% { -moz-transform: rotate(0); }
100% { -moz-transform: rotate(0); }
}