html, body{
	font-family: Arial;
	font-size: 14px;
	color: #540333;
	margin: 0px;
	padding: 0px;
	background: url(../img/fon.jpg);
	background-repeat: repeat-x;
	background-position: top left;
	background-color: #ffffff;
	width:100%;
	height:100%;
}

img{
	border: none;
}

.contact_info
{
width:100%;
 


}

#container{
	max-width:968px;
	width: 100%;
	position: relative;
	margin: 0 auto;
	overflow: hidden;
}

#top{
	height: 425px;
	width: 100%;
	position: relative;
	padding-left: 40px;
	padding-top: 50px;
	top: 0px;
	background: url(../img/top.png);
	background-repeat: no-repeat;
	background-position: top left;
}

#logo{
	width: 405px;
	height: 83px;

	top: 50px;
	left: 40px;
	background: url(../img/logo.png);
	background-repeat: no-repeat;
	background-position: top left;
}

#topmenu{
	width: 560px;
	height: 30px;
	background: url(../img/hor.png);
	background-repeat: repeat-x;
	background-position: bottom left;
	margin-top: 52px;
	text-transform: uppercase;
	font-weight: bold;
	font-size: 17px;
	color: #a40b6b;
	font-style: italic;
}

#topmenu ul{
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}

#topmenu li{
	display: inline;
	margin: 0px 10px 0px 0px;;
}

#topmenu li a{
	color: #a40b6b;
	text-decoration: none;
}

#topmenu a.menu_active {
	color: #f804a0;
	text-decoration: underline;
}

#tovar{
	width: 18% !important;
	height: 175px;
	margin: 8px 11px;
	padding-top: 0 !important;
}
#tovar img {
/*	width: 100%;
	height: auto; */
	max-width: 137px;
}
.opis{
	width: 345px;
	color: #ffffff;
	font-size: 13px;
}

.opis a{
	color: #00afde;
}

.pokaz{
	width: 368px;
	color: #ffffff;
	font-size: 13px;
	*line-height: 14px;
}

.podr{
	width: 207px;
	height: 42px;
	background: url(../img/podron.png);
	background-repeat: no-repeat;
	background-position: top left;
	border: 0px;
	color: #fff;
	text-decoration: underline;
	font-size: 17px;
}

#left{
	width: 22%;
	float: left;
	margin: 30px 0px 0px 30px;
}

#right{
	width: 66%;
	float: left;
	margin: 30px 0px 30px 30px;
}

.cb{
	clear: both;
}

.zag, h1, h2{
	width: 100%;
	margin:0px;
	font-weight:normal;
	padding-left:20px;
	background: url(../img/hor.png);
	background-repeat: repeat-x;
	background-position: bottom left;
	color: #aa0c71;
	font-style: italic;
	font-size: 23px;
	line-height:19px;
	padding-bottom:5px;
}

h1, h2 {  }
h2 { font-size:20px; font-style:normal; }

.leftmenu{
	width: 100%;
}

.leftmenu ul{
	list-style-type: none;
	padding: 0px;
	margin: 15px 0px 0px 15px;
}

.leftmenu li{
	margin: 2px 0px;
}

.leftmenu a{
	color: #500a34;
	font-size: 13px;
}

.reklama{
	margin: 25px 0px;
	width: 100%;
	text-align: center;
}

.reklama .up{
	color: #a40b6a;
	font-size: 13px;
	font-weight: bold;
	font-style: italic;
}

.reklama .down{
	color: #a40b6a;
	font-size: 23px;
	font-weight: bold;
	font-style: italic;
}

.reklamaimg{
	border: 4px solid #a3116c;
}

.info{
	width: 100%;
	text-align: justify;
	color: #540333;
	font-size: 14px;
	margin-bottom: 20px;
	line-height:19px;
}

.info a{
	color: #ee0489;
	font-size: 14px;
}

.buy{
	width: 100%;
	color: #540333;
}

.buy a{
	color: #ee0489;
}

.pok{
	height: 30px;
	background-color: #f2f2f2;
	margin: 10px 0px 0px 0px;
}

.name{
	width: 55px;
	margin-left: 20px;
	float: left;
	height: 100%;
	line-height: 30px;
}

.vr{
	width: 2px;
	height: 100%;
	background: url(../img/vert.png);
	background-repeat: repeat-y;
	background-position: top left;
	float: left;
}

.cena{
	height: 100%;
	width: 110px;
	float: left;
	text-align: center;
	line-height: 30px;
}

.sum{
	height: 100%;
	width: 110px;
	float: left;
	text-align: center;
	line-height: 30px;
}

.link{
	width: 120px;
	text-align:center;
 
	float: left;
	line-height: 30px;
}

#footer{
	width: 100%;
	height: 90px;
	clear: both;
	position: relative;
}

.copy{
	position: absolute;
	top: 15px;
	left: 30px;
	color: #500a34;
	font-size: 11px;
}

.ph{
	color: #500a34;
	font-size: 23px;
	font-style: italic;
	margin-left: 55px;
}
.op{
	color: #500a34;
	font-size: 13px;
	font-style: italic;
	margin-left: 55px;
}

.phone{
	position: absolute;
	right: 50px;
	width: 245px;
	height: 44px;
	background: url(../img/phone.png);
	background-repeat: no-repeat;
	background-position: top left;
}

html>/**/body .phone { width: 265px; }

.star{
	width: 49px;
	height: 50px;
	background: url(../img/star.png);
	background-repeat: no-repeat;
	background-position: top left;
	position: absolute;
	z-index: 5;
}

.p1{
	left: 807px;
	top: 17px;
}

.p2{
	right: 30px;
	top: 218px;
}

.p3{
	right: 18px;
	top: 32px;
}

.p4 {
    left: 175px;
    bottom: 20px;
}

/* 03.08.2016 */

#top .col {
	float: left;
	padding-top: 28px;
	width: 35.5%;
	position: relative;
}
#top .topbox {
	position: relative;
	margin-top: 40px;
	overflow: hidden;
}

.menu-btn {
	background: url('../img/menu-btn.png');
	width: 50px;
	height: 41px;
}
.menu-btn.active {
	background: url('../img/menu-btn-h.png');
}

.leftmenu-btn,
.menu-btn {
	border: none;
	display: none;
	cursor: pointer;
	outline: none;
	@include transition(0.4s);
}

.leftmenu-btn {
	background: url('../img/plus.png');
	width: 20px;
	height: 20px;
	float: right;
	margin-right: 1px;
}

.leftmenu-btn.active {
	background: url('../img/minus.png');
}

.key_text {
	font-size:12px;
}

.hphone { display:none; padding-top:10px;}
.hphone div { margin-bottom:10px;}

/* AJAX */

#loader{ display:none; }
.errors{ color:#D80000; font:11px Tahoma; text-align:center}
.wait { display:inline !important; }

.menu_active { font-weight:bold; }



@media screen and (max-width: 980px) {

	#top {
		background-position: -10px top;
	}
	.buy table > tbody > tr > td {
		width: 160px !important;
		width: auto !important;
	}
	
		.pok .sum{ display:none; }
	
	
	.buy table > tbody > tr > td img {
		width: 100%;
		height: auto;
		max-width: 177px !important;
		margin: 0 auto;
		display: block;

	}
	.buy table {
		width: 100%;
	}
	
	#right img {
		max-width: 100%;
	}
	.zag span {
		margin-left: 0;
	}
	.leftmenu ul {
		margin-left: 0 !important;
	}
	.guest {
		table-layout: fixed;
	}
	.delivery_type ul {
		width: 100%;
	}
	.delivery_type li.d_name {
		width: 80%;
	}
}

@media screen and (max-width: 767px) {
	.buy table > tbody > tr > td {
		max-width: 440px;
		margin: 0 auto;
	}

	.pok { width: 320px;}
	.contact_info { display:none; }
	.reklama{ display:none; }	

	
	.key_text { display:none; }

	#right,
	#left {
		width: 95%;
		margin: 5px 0px 0px 5px;
	}

	.zag, h1,h2 {
		height: auto;
		padding-left:0px;
	}

	.leftmenu ul {
		display: none;
	}
	.leftmenu-btn { display: block; }
	
	.hphone { display: block; text-align:center }
	.hphone a { color:#ee0489;}
}

@media screen and (min-width: 768px) {
	.leftmenu ul { display: block !important; }
}

@media screen and (max-width: 600px) {
	#topmenu {
		font-size: 15px;
	}
	
	

}
@media screen and (min-width: 551px) {
	#topmenu ul {
		display: block !important;
	}
}
@media screen and (max-width: 550px) {
	.buy table > tbody > tr > td {
		display: block !important;
		width: 100% !important;
	}
	
	.pok{    width: 380px; }
	
	.pok{ font-size:  1.5rem; }
	.pok a{ font-size:  1.3rem; }
	.pok .name { width:88px;}
	.pok .cena { width:140px;}
	.pok .link { white-space: nowrap; } 
	
		
	
	#footer .phone, 
	#footer .copy {
		position: static;
		margin: 0 auto;
		text-align: center;
	}
	#footer .phone {
		margin-top: 20px;
	}
	.menu-btn {
		display: block;
		margin: 0 auto;
		position: absolute;
		right: 15px;
		top: 35px;
	}
	#topmenu ul {
		display: none;
		position: absolute;
		left: 0;
		width: 100%;
		text-align: center;
		top: 80px;
		background: #a3106b;
		box-shadow: 2px 3px 16px #670040;
		z-index: 10;
	}
	#topmenu ul li {margin:0;}
	#topmenu ul li a {
		width: 100%;
		display: block;
		padding: 4px 0;
		color: #fff;
		border-top: 1px solid #bb177d;
		border-bottom: 1px solid #880a58;
	}
	#topmenu ul li:first-child a {
		border-top: none !important;
	}
	#topmenu ul li:last-child a {
		border-bottom: none !important;
	}
	#topmenu {
		background: transparent;
		width: 100%;
		height: auto !important;
	}
	#top {
		padding-left: 0 !important;
		padding-top: 15px !important;
		background-position-y: -90px !important;
		height: auto !important;
	}
	#tovar {display: none;}
	#top .col {
		padding-top: 5px;
		padding-left: 10px;
		width: 40%;
	}
	.guest td {
		border-bottom: #DBDBDB 1px solid;
		padding-bottom: 10px;
		width: 100%;
		display: block !important;
	}
	.guest th {
	    width: 100%;
	    display: block !important;
	    padding-top: 10px;
	    border-bottom: none !important;
	    padding-bottom: 10px !important;
	}
	.delivery_type ul {
		height: auto;
		overflow: hidden;
	}
	.delivery_type li.d_name {
		width: auto;
		height: auto;
		float: none;
	}
	.delivery_type li.d_cost {
		width: 70px;
		clear: both;
		height: auto;
	}
}

@media screen and (max-width: 480px) {
	.menu-btn {
	    margin-left: 0;
	    margin-right: 0;
	    margin: 0 auto;
	    left: 0;
	    right: 0;
	    top: 95px;
	}
	
	.pok{    width: 340px; }
	
	.pok{ font-size:  1.2rem; }
	.pok a{ font-size:  1.2rem; }
	
	.pok .name { width:68px;}
	.pok .cena { width:120px;}
	.pok .link { width:120px;} 
		
	#topmenu ul {
		top: 135px;
	}
	#top {
		padding-top: 0 !important;
	}
	#top .topbox {
		margin-top: 60px;
    }
    .pok {
    	margin: 2px 0 0 0;
    }
	.delivery_type span { display:none !important;  }
 
	.basket th {
	    padding: 2px !important;
	}
	.basket INPUT { width:30px !important; }

}

@media screen and (max-width: 400px) {
 
	.podr {
		margin-left: -50px;

  	}
	#top .col {
		width: 45%;
	}
	#logo {
		width: 97%;
		height: 80px;
		background-size: 100% !important;
	}
	.menu-btn {
		top: 85px;
	}
	.col {
		padding-top: 10px !important;
	}
	
 


	.form th,
	.form td {
		width: 100% !important;
		display: block !important;
		text-align: left;
	}
	table.basket th { padding: 2px; }
	table.basket TD { padding:2px !important; }
}

 
