/* www.serviceplus.sk | 27.9.2010 Peter Melaga | www.webygroup.sk */
/*----------------------------------------------------------
START CUSTOM CSS
---------------------------------------------------------- */

body, html{ font: normal 16px/140% Arial, Helvetica, sans-serif;}
a{ color: #ff0000; text-decoration: underline; outline:none;}
a:hover{color:#ff0000; text-decoration:none;}
img a:hover{ text-decoration: none; }
option{ padding-right: 1em; }
a img{border:0;}
img{max-width:100%; height:auto;}

ul, ol{ margin:0 0 10px 20px; padding:0;}
p{ margin:0 0 1em 0; padding:0; text-align:justify; }
h1, h2, h3, h4, h5, h6{ color: #fff; line-height:normal; font-family: Arial, Helvetica, sans-serif; margin:0; padding:15px 0 10px 0;}
h1{font-size: 24px; padding:0 0 0 20px; margin-bottom:15px; line-height:normal; font-weight:normal; background:url(images/li_cat.gif) no-repeat 0 10px; margin-top:20px;}
h2{font-size: 18px; line-height:normal;}
h3{font-size: 16px;}
h4{font-size: 11px;}

.skry{display:none;}
address{font-style:normal;}

/* main structure
-------------------------------------------------------*/
body{
	background: #1f1f20 url(images/bg-body.jpg) repeat-x 0 0;
	text-align: center;
	color: #fff;
	margin:0;
	padding:0;
}

#container{
	width: 1200px;
	margin: 0 auto;
	text-align: left;
	position: relative;
	max-width:100%;
}

#header{position:relative; min-height:130px;}
#head{
	width: 1200px;
	height: 130px;
	position: relative;
	background:url(images/bg-head.jpg) no-repeat 0 0;
	margin:0 auto;
	max-width:100%;
}

#content{
	padding:50px 0;
	overflow:hidden;
}

#footer{
	clear: both;
	width: 1200px;
	max-width:100%;
	position:relative;
	min-height:100px;
	margin:0 auto;
}

#footer p.copy{font-size:12px; text-align:center; padding:20px 0; margin:0; color:#6f6f6f; background:url(images/linka-f.png) no-repeat center top; background-size:100%;}
#footer a{color:#6f6f6f; text-decoration: underline;}
#footer a:hover{color:#6f6f6f; text-decoration:none;}
#pata{background:url(images/bg-pata.png) no-repeat 0 0; height:110px; background-size:100%;}
#pata p{margin:0; padding:40px 0 0 0; font-size:16px;}
#info{overflow:hidden; padding-top:30px;}
#info ul{margin-left:0;}
#info ul li{display:inline-table; font-size:16px; color:#fff; padding:10px 30px;}
#info ul li a:hover{color:#fff !important;}
#info ul li a{color:#fff;}
#info ul li i{color:#ff0000; font-size:18px; padding-right:18px;}
#info ul li img{vertical-align:middle; padding-left:5px;}

#page24829 h1{background:none;}

/* Logo - top
-------------------------------------------------------*/
#head #logo{
	padding: 0;
	margin: 35px 0px 0px 15px;
	float:left;
	
}


#slogan{position:relative; float:left; margin-top:43px; margin-left:50px; text-shadow:2px 2px 2px rgba(10, 10, 10, 1); font-size:20px; text-align:left;}
#slogan p{padding-left:20px; margin:0; padding-top:2px;}
#slogan span{display:block; padding-top:2px;}
#slogan:after{content:""; background:url(images/slogan-sep.png); width:3px; height:52px; position:absolute; left:0; top:0; }



/*  FLAGS */

#flags{position:absolute; top:56px; right:0px;}
#flags ul{margin:0; padding:0;}
#flags ul li{margin:0; padding:0; list-style:none; float:left; padding-left:6px;}
#flags ul li a{display:block; width:32px; height:25px; text-indent:-9999px; overflow:hidden; background-repeat:no-repeat; background-image: url(images/flags.png);}

#flags ul li#ml-sflags-sk a{background-position:-38px -25px;}
#flags ul li#ml-sflags-en a{background-position:0 -25px;}

#flags ul li#ml-sflags-sk a:hover, .skin-sk #flags ul li#ml-sflags-sk a{background-position:-38px 0;}
#flags ul li#ml-sflags-en a:hover, .skin-en #flags ul li#ml-sflags-en a{background-position:0 0;}


/***********************/

/* Menu
-------------------------------------------------------*/

#main-menu{
	position:absolute;
	top:-88px;
	right:140px;
}

#main-menu ul{
	margin: 0;
	padding: 0;
}

#main-menu li{
	list-style-type: none;
	margin: 0;
	padding:0 2px 0 0;
	float:left;
	position:relative;
	background:url(images/menu_separator.jpg) no-repeat right center;
}
#main-menu li:last-child{background:none;}
#main-menu li#mi-smainmenu-24829{background:none;}

#main-menu a{
	display:block;
	float:left;
	color:#fff;
	text-decoration:none;
	font-weight:bold;
	font-size:18px;
	height:50px;
	line-height:50px;
	padding:0 20px;
	/*text-shadow:2px 2px 2px rgba(10, 10, 10, 1);*/
	}
	
#main-menu a:hover, #main-menu .selected a, #main-menu li:hover a{color:#ff0000; text-decoration:none;}

#main-menu li ul{position:absolute; top:37px; left:0; width:160px; display:none; padding:20px 0; background: url(images/trans.png);}
#main-menu li:hover ul{}
#main-menu li ul li{float:none; background:none;}

#main-menu .title, #category-menu .title{display:none;}

/*  INTRO */
#intro{margin-top:40px;}
#intro ul{margin:0; padding:0;}
#intro ul li{margin:0; padding:0; list-style:none; }

#intro ul li.i1, #intro ul li.i3{clear:left; float:left;}
#intro ul li.i2, #intro ul li.i4{clear:right; float:right;}

#intro ul li a{display:block; height:288px; margin-bottom:1px; position:relative; color:#FFF; text-decoration:none; font-size:24px; cursor:pointer; width:587px;}
#intro ul li a:hover{color:#FFF; text-decoration:none;}
#intro ul li a .img{display:block; height:205px; background:#fff; cursor:pointer; padding:2px;}
#intro ul li a:hover .img{background:#2997c0;}
#intro ul li a .name{display:block; cursor:pointer; height:60px; padding-top:20px; position:relative; padding-left:20px; background:url(images/tien_l.png) no-repeat 0 0; background-size:100%;}

#intro ul li a .name span{display:block; width:11px; height:9px; background:url(images/li_cat.gif) no-repeat 0 0; position:absolute; left:0; top:26px;}
#intro ul li.i2 a .name, #intro ul li.i4 a .name{text-align:right; padding-right:20px; padding-left:0; background:url(images/tien_r.png) no-repeat 0 0; background-size:100%;}
#intro ul li.i2 a .name span, #intro ul li.i4 a .name span{right:0; left:auto;}

#intro ul li a:hover .name{}/* background:#0e546f; */
#intro ul li.i3 a .name, #intro ul li.i4 a .name{height:67px;}
#intro ul li.i5{clear:left; margin:0 auto; display:block;}
#intro ul li.i5 a{margin:0 auto;}
#intro ul li.i5 a .name{text-align:center; background:url(images/tien-i5.png) no-repeat 0 0; height:60px; background-size:100%;}
#intro ul li.i5 a .name span{left:165px;}



/* ***********  */

#category-menu{
	position:absolute; background:url(images/menu-bg.jpg) repeat-x 0 0; width:100%;
	top:0px;
	left:0;
	z-index:10;
	}
	
#category-menu ul{
	margin: 0;
	padding: 0;
}

#category-menu li{
	list-style-type: none;
	margin: 0;
	padding:0 2px 0 0;
	float:left;
}
#category-menu li#Item-4{background:none; padding-right:0;}

#category-menu a{
	display:block;
	float:left;
	color:#fff;
	text-decoration:none;
	font-weight:normal;
	font-size:18px;
	height:50px;
	line-height:50px;
	padding:0 35px;
	/*text-shadow:2px 2px 2px rgba(10, 10, 10, 1);*/
	}
	
#category-menu a:hover, #category-menu li:hover, #category-menu .selected a{color:#fff; text-decoration:none; background:#08516c;}
#category-menu a span{padding-left:20px; background:url(images/li_cat.gif) no-repeat 0 6px;}

#category-menu ul li ul{display:none; position:absolute; top:50px; left:0; width:100%; padding:20px 0; background: #084157/*url(images/trans.png)*/; float:none; overflow:hidden;}
#category-menu ul li ul li,
#main-menu li ul li{padding:2px 20px; float:none; margin:0; background:none;}
#category-menu ul li ul li:hover,
#main-menu li ul li:hover{background:none;}
#category-menu ul li ul li a,
#category-menu ul li.selected ul li a,
#main-menu li ul li a,
#main-menu li ul li.selected a,
#main-menu li:hover li a{
	float:none;
	display:inline;
	font-weight: normal;
	font-size:12px;
	height:auto;
	line-height:normal;
	text-shadow:none;
	padding-left:15px;
	background:url(images/arrow.gif) no-repeat 0 3px;
}
#category-menu ul li ul li a:hover,
#category-menu ul li.selected ul li a:hover,
#main-menu li ul li a:hover,
#main-menu li.selected ul li a:hover{
	background:none;
	color:#ff0000;
	background:url(images/arrow.gif) no-repeat 0 -18px;
}

#submenu{display:none;} /* position:absolute; top:37px; right:0px; width:100%; background:rgba(8,65,87,0.9); */





.Obchod_Produkt_Ikony{border-collapse: separate;}
.Obchod_Produkt_Ikony td{width:224px; background:#ffffff; text-align:center; padding:2px; vertical-align:middle;}
.Obchod_Produkt_Ikony td a{}
.Obchod_Produkt_Ikony td.Obchod_Product_Name{background:url(images/bg-product.jpg) repeat-x; color:#FFF; height:85px; padding:0; background-size:100%;}
.Obchod_Produkt_Ikony td.Obchod_Product_Name a{color:#fefefe; text-decoration:none; display:block; padding:10px; font-size:16px;}
.Obchod_Produkt_Ikony td.Obchod_Product_Name a:hover{color:#fff; text-decoration:none;}
.Obchod_Produkt_Ikony td:hover{background:#2997c0;}
.Obchod_Produkt_Ikony td.sep{padding:5px; background:none; width:auto;}
.Obchod_Produkt_Ikony td a img{width:220px;}


.left-col{
	float:right;
	width:278px;
	
}
.left-col .PhotoImage{margin-bottom:15px;}
.left-col .PhotoImage a{display:block;}
.left-col .PhotoImage a img{border:2px solid #fff; width:273px;}
.left-col .PhotoImage a:hover img{border:2px solid #2997c0;}

.ProductDescription{
	float:left;
	width:290px;
	padding:0 25px 0 0px;
}
.ProductDescription h1{font-size:24px;}
.ProductDescription p{margin:0; padding:0 0 15px 0;}
.ProductImageWrapper{float:left; width:584px;}
.ProductImageWrapper img{max-width:580px; border:2px solid #fff;}
.ProductImageWrapper a:hover img{border-color:#2997c0;}


/* Nadradene kategorie - cesta
---------------------------------------------------------- */
.ShopProductParentCategories {
	text-align:left;
	width: 100%;
	overflow:hidden;
	padding:20px 0 20px 0;
}
.ShopProductParentCategories ul {
	margin: 0;
	padding: 0px;
}
.ShopProductParentCategories ul li {
	display: inline;
	list-style:none;
}

.images{text-align:center;}
.box{display:inline-table; width:220px; margin-right:20px; box-sizing:border-box; padding-bottom:20px;}
.box:last-child{margin-right:0;}
.box img{width:216px; vertical-align:middle; height:145px !important; border:2px solid #fff;}
.box a:hover img{border-color:#08516c;}

.box .Obchod_Product_Name{height:85px; background:url(images/bg-product.jpg) repeat-x; text-align:center;}
.Obchod_Product_Name a{color:#fff; text-decoration:none; display:block; height:100%; padding:10px 5px 0px 5px; font-size:14px;}

table.kontakt img{float:left; padding:0 15px 30px 15px;}
table.kontakt td:nth-child(2), table.kontakt.vedenie td:nth-child(3), table.kontakt.projekt td:nth-child(3){padding-top:40px;}
table.kontakt td:first-child img{padding-bottom:0;}

.kontakt.vedenie img{padding-left:0; padding-bottom:0;}
table.kontakt.projekt .qr{padding-bottom:60px;}
table.kontakt.projekt img{padding-bottom:20px;}



@media only screen and (max-width:1175px) {
	#intro ul li a{width:499px;}
	#intro ul li a .img{height:auto;}
	#intro ul li.i5 a .name span{left:135px;}
	.ProductImageWrapper img,.ProductImageWrapper{width:530px;}
}


@media only screen and (max-width:1125px) {
.ProductImageWrapper img,.ProductImageWrapper{width:420px;}
}

@media only screen and (max-width:1024px) {
#head{background-size:100%;}
#slogan{font-size:14px;}
#main-menu{right:115px;}
#category-menu a{padding:0 25px;}
#content{padding:50px 10px 0 10px;}
#intro ul li a{width:499px;}
#intro ul li{display:inline-table;}
#intro ul li.i1, #intro ul li.i3, #intro ul li.i2, #intro ul li.i4{float:none;}
#intro ul li a .img{height:auto;}
#intro ul li.i5{display:block;}
#intro ul li.i5 a .name span{left:135px;}
.Obchod_Produkt_Ikony td.Obchod_Product_Name, #pata{height:auto;}
#pata{padding:10px;}
.ProductDescription{width:100%;}

}


@media only screen and (max-width:1022px) {
#intro ul li a{width:490px;}
#intro{text-align:center;}
}

@media only screen and (max-width: 989px) {
	#container,
	#head,
	#menu-main .content{width:768px; margin:0 auto;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;}
	#container{padding:10px;}
	#head{padding:0 10px;}
	#head #logo{margin:25px 0px 0px 15px;}
	#logo img{max-width:200px;}
	#slogan{clear:left; margin-left:0; margin-top:7px;}
	#slogan:after{display:none;}
	#slogan p{padding-left:15px;}
	table{table-layout:fixed; max-width:100%;}
	img{max-width:100%; height:auto !important;}
	iframe{max-width:100%;}
	#category-menu a{padding:0 12px; font-size:14px;}
	#intro{text-align:center;}
	#intro ul li a .name span{left:120px;}
	#intro ul li.i2 a .name, #intro ul li.i4 a .name{text-align:center;}
	#intro ul li.i2 a .name span, #intro ul li.i4 a .name span{right:150px;}
	#pata p{padding:0;}
	.Obchod_Produkt_Ikony td.Obchod_Product_Name a{font-size:14px;}
	.ProductImageWrapper{width:420px;}
	.ProductImageWrapper img, .left-col .PhotoImage a img{max-width:100%;}
	.left-col{width:195px;}
	#intro ul li.i5{width:auto;}
	table.kontakt td{display:block; margin-bottom:25px; width:100% !important; overflow:hidden;}
}

@media only screen and (max-width:767px) {
	
	#container-main,
	#container,
	#head{width:auto; min-width:320px;}
	#head{padding-bottom:5px; background:none;}
	#logo{margin:10px 0; float:none; text-align:center;}
	#content{float:none !important; width:auto !important; clear:both !important; padding:10px !important;}		
	#container-outer{position:relative; padding:0px 0 0 0;}
	#left{width:100%; float:none; padding-top:15px;}
	#header{min-height:0;}
	#container{padding:50px 0 0 0;}
	.center-outer{overflow: hidden;}
	.center-out{position: relative; left: 50%; float: left;}
	.center-inner{position: relative; left: -50%; float: left;}	
	.left, .right{float:none; width:auto; max-width:100%; margin-bottom:10px;}
	.copy{height:auto;}
	.copy p{height:auto; line-height:normal; text-align:center; padding:10px 0;}
	
	.slogan{position:static; width:auto; font-size:12px; border:0; padding:0; margin:5px 0; float:none; text-align:center;}
	
	
	#category-menu,#main-menu{z-index:auto;}
	#category-menu.mbmenu, #main-menu.mbmenu{position:absolute; width:96%; padding:0 2%; margin:0 !important; top:0px; left:0; background:none !important; min-height:0; height:auto;}
	#main-menu.mbmenu ul li{float:none; border:0; background:none;}
	#main-menu.mbmenu ul li a{float:none;}
	.mbmenu .title{
		padding:0;-webkit-border-radius: 0px;-moz-border-radius: 0px;border-radius: 0px; width:49%; position:relative;
		border:0;
		filter: none;
		-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;
		}
	#category-menu .title{float:left; display:block !important;}
	#main-menu .title{float:right; display:block !important; text-align:left;}

	.mbmenu .title h3{position:relative; height:46px !important; line-height:46px !important; padding:0;
		font-size:14px; color:#4444; text-indent:15px;
		background:#1e7190;
		z-index:10;
		color:#fff;
	}
	.mbmenu.selected .title h3{
		background-color:#277ea0;
		border-color:#277ea0;
		height:50px !important;
		border-bottom-color:#277ea0;
	}

	.mbmenu h3 a{display: block; width:96%; height:100%; position:absolute; top:0; left:0; padding:0 2% !important;}
	.mbmenu h3 a:after{content:""; display:block; position:absolute; top:20px; margin-top:-4px; right:3%; width:20px; height:20px; background:url(images/ico-cat.png) no-repeat 0 0;}
	.mbmenu.selected h3 a:after{background-image:url(images/ix.png);}
	.mbmenu .content{display:none;position:absolute !important; top:49px; left:0; width:96% !important; padding:2% !important; background:#277ea0;
		 border:1px solid #277ea0;
		
	}
	.mbmenu ul{float:none !important;}

	#main-menu ul.sjMenu li, #category-menu ul.Cat li{border:0;}
	#main-menu ul.sjMenu li a, #main-menu ul.sjMenu li li a,#category-menu ul.Cat li a{float:none; display:block; padding:0px 5% !important; text-align:left; background:#45a0c4 url(images/white-arrow.png) no-repeat 95% center; color:#fff; border:0; border-bottom:1px solid #FFFFFF; font-weight:bold; font-size:12px !important;}
	#category-menu ul.Cat li a span{background:none; padding:0;}
	#main-menu ul.sjMenu li li a{background-color:#fefefe; color:#000; display:block; border-bottom-color:#ccc;}
	#main-menu ul.sjMenu li ul{display:block !important; position:static; width:100%; border:0 !important;-webkit-box-shadow:none;-moz-box-shadow:none;box-shadow:none;}
	

	#main-menu ul.sjMenu li a:hover,#category-menu ul.Cat li a:hover{text-decoration:none; color:#fff; background-color:#08516c;}
	#category-menu li,#category-menu li a{float:none !important;}
	#category-menu a:hover, #category-menu li:hover, #category-menu .selected a{background:none !important;}
	#category-menu a span, #intro ul li a .name span{background:none;}
	#category-menu ul li ul{display:none !important;}
	#intro ul li a{height:auto;}
	#intro{margin-top:0;}
	.left-col, .ProductImageWrapper{float:none; width:100%; text-align:center;}
	.box{margin-right:0;}
	
	table.kontakt td{display:block; margin-bottom:25px; width:100% !important; overflow:hidden;}
	

}

@media only screen and (max-width:600px) {
#intro ul li a{width:auto;}
}

@media only screen and (max-width:330px) {
#flags{right:15px; top:25px;}
#flags ul li{float:none; padding-left:0;  padding-bottom:5px;}
	
}