
@import url('https://fonts.googleapis.com/css?family=Titillium+Web:400,600&subset=latin-ext');

@import url('https://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700&subset=latin-ext');





/* Getting the new tags to behave */
article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video {display:block}
mark, rp, rt, ruby, summary, time {display:inline}
/* Global properties */
html {width:100%}
body {font-family:"Lucida Grande", "Lucida Sans Unicode", Helvetica, Arial, sans-serif;font-size:100%;color:#777;background:#F3F3F3}
.ic, .ic a {border:0;float:right;background:#fff;color:#f00;width:50%;line-height:10px;font-size:10px;margin:-220% 0 0 0;overflow:hidden;padding:0}
.bg {width:100%;background:#F3F3F3 url(../gfx/bg.png) center 112px no-repeat; }  /*139px pro top odk. fb atd.*/
.main {padding:0;margin:0 auto;font-size:0.875em;line-height:1.5em;}
a {color:#8ABF50;text-decoration:underline}
a:hover {color:#8ABF50;text-decoration:none;outline:none}
.wrapper {width:100%;overflow:hidden;position:relative}
.extra-wrap {overflow:hidden}
p {margin: 0 0 18px 0; padding: 0; font-size:1.1em; line-height: 1.5;}
.p1 {margin-bottom:8px}
.p2 {margin-bottom:15px}
.p3 {margin-bottom:30px}
.p4 {margin-bottom:40px}
.p5 {margin-bottom:50px}
.fleft {float:left}
.fright {float:right}
.alignright {text-align:right}
.aligncenter {text-align:center}
.color-1 {color:#fff}
.color-2 {color:#000}
.color-3 {color:#4f4f4f}
.border {padding:3px;border:1px solid #e5e5e5;background:#fff}
/*boxes*/
.margin-bot {margin-bottom:35px}
.indent-top {padding-top:10px}
.indent-left {padding-left:20px}
.indent-left2 {padding-left:10px}
.indent-left3 {padding-left:5px}
.indent-bot {margin-bottom:20px}
.indent-bot2 {margin-bottom:27px}
.indent-bot3 {margin-bottom:45px}
.img-indent-bot {margin-bottom:25px}
.img-indent {float:left;margin:0 20px 0 0}
.img-indent-right {float:right;margin:0 0 0 20px}
.prev-indent-bot {margin-bottom:10px}
.prev-indent-bot2 {margin-bottom:6px}
.buttons a:hover {cursor:pointer}
.menu li a, .list-1 li a, .list-2 li a, .link, .button, .logo {text-decoration:none}
/*header*/
header {width:100%;/*padding-bottom:44px;margin-bottom:-30px*/}
	/*#page1 header {min-height:600px;}*/
/* menu */
.menu-row {width:100%;}
.menu {padding:0;width:100%; height: 83px;}
.menu li {float:left;position:relative;}
	.menu li.last-item {background:none}
.menu li a {display:block;/*width:188px;*/font-family: 'Titillium Web', sans-serif; font-size:1.4em;line-height:2em;font-weight:normal;padding:22px 46px 12px 46px;margin:0 0 4px 0;color:#AAA;text-align:center;text-transform: uppercase;}
.menu li a.active {color:#99C767; border-top: 3px solid #8ABF50; padding:19px 46px 12px 46px;}
.menu li a:hover {color:#99C767; border-top: 3px solid #8ABF50; padding:19px 46px 12px 46px;}
.menu li.active, .menu li:hover {}
h1 span {display:none;}
/*h1 {font-family: 'Ubuntu', sans-serif;padding:20px 0 0 0; margin: 0;line-height:1.219em;position:relative; color: #555; font-size:1.6em;font-weight:300;}*/
	/*#page1 h1 {padding:31px 0 0 49px}*/

/*content*/
#content {width:100%;padding:0;}
	/*#page1 #content {padding:0 0 40px 0}*/
	/*#page5 #content {padding:0 0 34px 0}
	#page3 #content {padding:0 0 52px 0}*/
h2 {font-family: 'Ubuntu', sans-serif;padding:20px 0 0 0; margin: 0;line-height:1.219em;position:relative; color: #555; font-size:1.6em;font-weight:300;	text-transform: uppercase;
}
h3 {font-family: 'Ubuntu', sans-serif;font-size:1.4em;line-height:1.219em;margin: 10px 0 5px 0;color:#8ABF50;font-weight:300;}
h4 {font-family: 'Ubuntu', sans-serif;font-size:1.1em;line-height:1.214em;margin: 10px 0 0 0;color: #555;font-weight:300;}
.border-bot {width:100%;padding-bottom:21px;background:url(../gfx/pic-1.gif) 0 bottom repeat-x}
.tlacitko {display:inline-block;font-size:18px;line-height:1em;font-weight:400;text-transform:uppercase;padding:4px 13px 4px;color:#F5D760;background-color:#A42617;border-radius:7px;-moz-border-radius:7px;-webkit-border-radius:7px}
	.tlacitko:hover {background:#171717}
.list-1 li {font-size:14px;line-height:17px;padding:7px 0 7px 0;}
	.list-1 li a {display:inline-block;color:#4f4f4f}
	.list-1 li a:hover {color:#3399CC}
.link:hover {text-decoration:underline}
.text-1 {display:block;font-size:14px;line-height:21px}
	.text-1 a {color:#181818}
.tdate-1 {display:block;font-size:14px;line-height:21px;font-weight:bold}
	.tdate-1 a {color:#0dc2ce}
.numb {display:block;width:60px;height:60px;text-indent:-5000px;float:left;margin-right:20px}
	.numb.first {background:url(../gfx/numb-1.png) 0 0 no-repeat}
	.numb.second {background:url(../gfx/numb-2.png) 0 0 no-repeat}
	.numb.third {background:url(../gfx/numb-3.png) 0 0 no-repeat}
dl span {float:left;width:85px;font-size:14px}
dl dd {font-size:13px}
/* Contact form */
#contact-form {display:block}
	#contact-form label {display:block;height:31px;overflow:hidden}
	#contact-form input {float:left;width:50%;font-size:13px;line-height:1.23em;color:#4f4f4f;padding:4px 10px;margin:0;font-family:Arial, Helvetica, sans-serif;border:1px solid #e5e5e5;background:none}
	#contact-form textarea {float:left;height:175px;overflow:auto;width:80%;font-size:13px;line-height:1.23em;color:#4f4f4f;padding:3px 10px;margin:0;font-family:Arial, Helvetica, sans-serif;border:1px solid #e5e5e5;background:none}
.text-form {float:left;display:block;font-size:14px;line-height:26px;width:112px;color:#4f4f4f;font-family:Arial, Helvetica, sans-serif}
.buttons {clear: both; padding-top:20px;}
.buttons a {margin-right:10px; margin-bottom: 10px;}
/*aside*/
aside {width:100%;padding:25px 0 51px;background:#efefef}
/*footer*/
footer {width:100%;color:#fff;padding:35px 0 20px 0; background-color: #737375; border-top: 1px solid #606061;}
footer a {color:#8ABF50;text-decoration:none;outline:none}
footer a:hover {color:#8ABF50;text-decoration:underline}
footer h2 {color:#8ABF50; font-size: 1.3em;}
footer p {
	margin: 0 0 14px 0;
	padding: 0;
	line-height: 1.3;
}
	
/* Galerie*/
 div.gallery-image 		{float:left; margin-right:5px; margin-bottom:25px;}
 div.gallery-image.last	{margin-right:0px;}
 
 div.pOdkaz 				{float:left; margin: 10px 0 15px 0;}

 
.clear {
    clear: both;
    height:0px;
    float:none;
    font-size:0px;
    line-height:0px;
    margin:0;
    padding:0;
    display:block;
}

.nobr	{ white-space:nowrap; }


.pb5 { padding-bottom:5px;}	
.pb10 { padding-bottom:10px;}	
.pb15 { padding-bottom:15px;}
.pb20 { padding-bottom:20px;}
.pb30 { padding-bottom:30px;}	
.pb40 { padding-bottom:40px;}
.pb50 { padding-bottom:50px;}
.pb60 { padding-bottom:60px;}
.pb80 { padding-bottom:80px;}

 
div.nahoru {
	float: left;
	position: relative;
	width: 100%;
	text-align: center;
}
a.nahoruGrey {
	color: #676767;
}

a.aTit {text-decoration:none}
a.aTit:hover {text-decoration:underline}

div.listLSloupec {float:left; width:50%; }
div.listRSloupec {float:right; width:50%; }
div.listLSloupec  ul, div.listRSloupec  ul {list-style-position: inside;}
div.listLSloupec  ul li, div.listRSloupec  ul li {line-height: 1.5; list-style-type: disc; font-weight: bold; color:#881029;}

ul.list-3{list-style-type: circle;list-style-position: inside; margin: 0 0 15px 10px;}
ul.list-3 li {font-size:14px;line-height:1.2;padding:3px 0 3px 0;}


div#topOdkazy {
	float: left;
	position: relative;
	width: 100%;
	margin: 15px 0 0 0;
	text-align: right;
}
div#topOdkazy p {
	margin: 0 15px 0 0;
}
div#topImg {
	float: left;
	position: relative;
	width: 100%;
	margin: 0 0 15px 0;
	text-align: center;
}
div#topMenu {
	float: left;
	position: relative;
	width: 100%;
	margin: 0;  
	text-align: center;
	background:#FBFBFB;
}


.fleft-img {
	float: left;
	margin: 0 35px 15px 0;

}
.fright-img {
	float: right;
	margin: 0 0 15px 35px;

}

.border1 {
	border: 1px solid #bbb; 
	padding: 1px;
}
.dgrey {
	color:#444;
}
p.pHp {
	color: #444;
}
p.pHp a {
	color: #444;
	text-decoration: none;
}
p.pHp a:hover {
	color: #3399CC;
	text-decoration: underline;
}
.center {
	text-align: center;
}
.right {
	text-align: right;
}

div.divOdkForm a {
	background: #0099CC;
	padding: 15px 35px;
	margin: 0 auto;
	color: #fff;
	font-size: 2.6em;
	font-weight: bold;

	position: relative;
	text-decoration: none;
	display: block;
	/*width: 80%;*/
	border-radius:10px;
	-moz-border-radius: 10px;
	-khtml-border-radius: 10px;
	-webkit-border-radius: 10px;
	line-height: 1.3;
	text-align: center;
	letter-spacing: .5px;
	
}
div.divOdkForm a, div.divOdkForm a:hover {
	color: #fff;
	text-decoration: none;
}

div.hpBoxy-out {
	width: 100%;
	float: left;
	position: relative;
	background-color: #F6F6F6;
	/*height: 310px; NESMI BYT KVULI RESPONSIVE*/
	text-align: center;
}
div.hpBoxy {
	display: inline-block;
	/*height: 310px; NESMI BYT KVULI RESPONSIVE*/
}
div.hpBoxy h2 {
	color: #333;
	font-size: 1em;
	text-transform: uppercase;
	padding: 175px 0 0 0;
}
div.hpBoxy a {
	text-decoration: none;
}
div.box1 a:hover div, div.box2 a:hover div, div.box3 a:hover div {
	background-color: #02576C;
	
	filter: alpha(opacity=80);
	-moz-opacity: 0.8;
	-khtml-opacity: 0.8;
	opacity: 0.8;


}	
div.box1 a:hover div h2, div.box2 a:hover div h2, div.box3 a:hover div h2 {
	color: #fff; 
} 

.box1, .box2, .box3 {
	float: left;
	position: relative;
}
div.box1 a div {
	width: 150px;
	height: 200px;
	padding: 15px;
	margin: 40px 10px 40px 10px;

	background: #fff url(../gfx/box1.jpg) center top no-repeat;
}
div.box2 a div {
	width: 150px;
	height: 200px;
	padding: 15px;
	margin: 40px 10px 40px 10px;

	background: #fff url(../gfx/box2.jpg) center top no-repeat;
}
div.box3 a div {
	width: 150px;
	height: 200px;
	padding: 15px;
	margin: 40px 10px 40px 10px;

	background: #fff url(../gfx/box3.jpg) center top no-repeat;
}
	
	div.ap-photo a {
		position: relative;
		text-decoration: none;
		float: left;
		display: block;
		height: 103px;
		margin: 0 10px 10px 0;
		border: 1px solid #BDBCBC;		
		
	}
	div.ap-photo a img {
		height: 103px;
		margin: 0;
		
	}	
.inl {
	display: inline;
}
a.und {
	text-decoration: underline;
}
a.und:hover {
	color: #333;
}

div.fb img, div.fb span {
	vertical-align: middle;
}
div.fb a {
	color: #fff;
	text-decoration: none;
}
div.fb a:hover {
	text-decoration: underline;
}


/* form v kontaktech */



div.dForm { 
	
}

div.dForm input.i1 { 
	width: 300px;
	margin: 3px 0;
}
div.dForm textarea { 
	width: 300px;
	height: 60px;
	margin: 3px 0;
}
div.dForm label { 
	min-width: 90px;
	display: inline-block;
}
div.dFormErr { 
	background-color: #cc0000;
	border: 1px solid #AD3122;
	padding: 15px 20px;	
	
}

/*chybovky v PHP formulari:*/
p.pErr {color: #fff; font-weight: bold; font-size: 1.2em;}
/*hlasky o odeslani/neodeslani v PHP formulari:*/
p.pHlasky {color: #cc0000; font-weight: bold; font-size: 1.2em;}


input.tlacitko { background-color: #006699; color: #ffffcc; font-weight: bold; cursor: hand; padding: 6px 20px; margin-top: 7px; font-size: 1.1em; letter-spacing:2px}


/* k" form v kontaktech */


div.obsah {
	background:#FBFBFB;
}

	#divPhoto {
		position: relative;
		float: left;
		width: 960px;
		height: 400px; 
		margin: 0 0 20px 0;
		padding: 0;
		
	}
	

	
	#divTopObr {
		position: relative;
		float: left;
		width: 960px;
		height: 50px; 
		margin: 0;
		padding: 0;
		background: transparent url(../gfx/top-obr.jpg) no-repeat center top;

		
		
		
	}
	
	
	#divMezera {  /* na podstrankach misto divPhoto */
		position: relative;
		float: left;
		width: 960px;
		height: 20px; 
		margin: 0;
		padding: 0;
		
		/*display: none;*/
		
		
	}
	


	
/* boxy: */	
div#boxy {
	float: left;
	position: relative;
	width: 100%;
	max-width: 960px;
	margin: 0;
	padding: 0;

}
div#boxy a {
	text-decoration: none;
}
div#boxy .box {
	margin: 0 5px;
	text-align: center;
}
div#boxy .box p.odk {
	margin: 0 0 5px 15px;
	text-align: left;
	font-size: 0.9em;
	padding: 0;
	
}

div#boxy .box p.odk a {
	text-decoration: none;
	color: #000;
	font-weight: bold;
}
div#boxy .box p.odk a:hover {
	text-decoration: underline;
	color: #000;
}

div#boxy .box p.oddel {
	margin: 0;
	padding: 0;
	font-size: 0.1em;
}

div#box1, div#box2, div#box3, div#box4 {
	background: transparent url(../gfx/box-bg.png) no-repeat top center;
	margin: 0 auto; /* centrovani */
	max-width: 228px;
	height: 273px;
}


div#box1-obr {
	background: transparent url(../gfx/box1.jpg) no-repeat center 9px;
	margin: 0 auto; /* centrovani */
	max-width: 214px;
	height: 108px;
	padding-top: 25px; /* nejde pres margin u .box*/
}
div#box2-obr {
	background: transparent url(../gfx/box2.jpg) no-repeat center 9px;
	margin: 0 auto; 
	max-width: 214px;
	height: 108px;
	padding-top: 25px; 
}
div#box3-obr {
	background: transparent url(../gfx/box3.jpg) no-repeat center 9px;
	margin: 0 auto; 
	max-width: 214px;
	height: 108px;
	padding-top: 25px; 
}
div#box4-obr {
	background: transparent url(../gfx/box4.jpg) no-repeat center 9px;
	margin: 0 auto; 
	max-width: 214px;
	height: 108px;
	padding-top: 25px; 
}



div#box1 div.ram, div#box2 div.ram, div#box3 div.ram, div#box4 div.ram {
	margin: 0 auto;
	width: 160px;
	/*height: 61px;*/
	color: #ccc;
	text-align: center;
	padding: 12px 1px;
	border: 2px solid #fff;

}

div#box1 h2, div#box2 h2, div#box3 h2, div#box4 h2 {
	/*margin-top: 150px;*/
	text-transform: uppercase;
	color: #fff;
	text-shadow: 1px 1px #333;
	text-align: center;
	font-size: 1.3em;
	font-weight: normal;
	margin: 1px;
	padding: 0;
}
div#box1 h2 span, div#box2 h2 span, div#box3 h2 span, div#box4 h2 span {
	color: #fff;
	text-align: center;
	font-size: 0.9em;
	font-size: 0.7em\9; /* IE6, IE7, IE8, IE9 - funguje mi i v IE10, ale v 11 ne */
	font-weight: normal;
	display: block;
}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {  /* pro IE10 a vyse */
	/* IE10+ specific styles go here */  
	div#box1 h2 span, div#box2 h2 span, div#box3 h2 span, div#box4 h2 span {
		font-size: 0.7em;
	}  
}


.pb-h2-boxy { 
	padding-bottom:144px;
}

	
/* k: boxy */	



/* nahodne produkty: */	
div#produkty {
	float: left;
	position: relative;
	width: 100%;
	max-width: 960px;
	margin: 0;
	padding: 0;

}
div#produkty a {
	text-decoration: none;
}
div#produkty .box {
	margin: 0;
	text-align: center;
}


div.produkt {
	background: transparent url(../gfx/box-bg.png) no-repeat top center;
	margin: 0 auto; /* centrovani */
	max-width: 228px;
	height: 273px;
	position: relative;
}
div.produkt img {
	max-width: 228px;
	max-height: 160px;
	margin: 9px 0 0 0;
}

div.produkt h3 {
	/*margin-top: 150px;*/
	text-transform: uppercase;
	color: #8ABF50;
	text-align: left;
	font-size: 1.1em;
	line-height: 1.5;
	font-weight: normal;
	margin: 30px 10px 0 15px;
	padding: 0;
}




.div-box-text {
    position: absolute;
    bottom: 0;
    width: 228px;
	height: 104px;
	
}
.div-box-text h3 {
    text-align: center;
	font-size: 1.3em;
	line-height: 1.4; 
}



	
/* k: nahodne produkty */	



/* seznam produktu: */	
div.produkty-seznam {
	float: left;
	position: relative;
	width: 100%;
	max-width: 960px;
	margin: 0;
	padding: 0;

}
div.produkty-seznam a {
	text-decoration: underline;
}
div.produkty-seznam .box {
	margin: 0 5px;
	text-align: center;
}


div.produkt-s {
	background: transparent url(../gfx/box-bg.png) no-repeat center top;
	margin: 0 auto; /* centrovani */
	max-width: 228px;
	height: 273px;
	position: relative; /* musi byt, aby nazvy v div-box-text-s nebyly sechny v dolnum radku*/
	/*float: left;*/ /* nesmi but, jinak necela vel. divu */
	
}
div.produkt-s img {
	max-width: 228px;
	max-height: 160px;
	margin: 9px 0 0 0;
}

div.produkt-s h3 {
	/*margin-top: 150px;*/
	text-transform: uppercase;
	color: #8ABF50;
	text-align: left;
	font-size: 1.1em;
	line-height: 1.5;
	font-weight: normal;
	margin: 30px 10px 0 15px;
	padding: 0;
}




div.div-box-text-s {
    position: absolute;
    bottom: 0;
    width: 228px;
	height: 104px;
	
}
.div-box-text-s h3 {
    text-align: center;
	font-size: 1.3em;
	line-height: 1.4; 
}



	
/* k: seznam produktu */	


p.pro-caru {
	margin: 0 0 3px 0;
	padding: 0;
}
hr.cara1 {
	background-color: #555;
	height: 1px;	
	width: 200px;

}
a#dalsi-produkty {
	color: #8ABF50;
	font-weight: bold;
	text-decoration: none;
	font-size: 1.2em;
}
a:hover#dalsi-produkty {
	color: #000;
}
div.druh-skupiny h2{
	text-transform: none;
	margin: 0 0 2px 0;
	padding: 0;
	font-size: 1.3em;
	line-height: 1.5;
	
}
div.druh-skupiny h2 a{
	color:#8ABF50;
}

div.produkt-detail h3 {  /* detail produktu */
	margin: 25px 0 0 0;
}

div.produkt-detail div.pol {  /* detail produktu - polozka */

}
div.produkt-detail div.pol div.naz {  /* nazev polozky */
	display: block;
	float: left;
	width: 200px;
}
div.produkt-detail div.pol div.hod {  /* hodnota polozky */
	display: block;
	float: left;
	font-weight: bold;
}

div.produkt-detail img.hl {  /* hl. obr. */
	max-width: 250px;
}


/* detail produktu - dalsi obrazky: */

	div.produkt-detail-dalsi-obrazky {
		position: relative;
		float: left;
		display: block;
		margin: 5px 0 10px 0;
		
	}
	div.produkt-detail-dalsi-obrazky a {
		position: relative;
		text-decoration: none;
		float: left;
		display: block;
		height: 81px;
		margin: 0 10px 10px 0;
		border: 1px solid #BDBCBC;		
		
	}
	div.produkt-detail-dalsi-obrazky a img {
		height: 81px;
		margin: 0;
		
	}	
	
/* k: detail produktu - dalsi obrazky */



	
	
	div.gallery a {
		position: relative;
		text-decoration: none;
		float: left;
		display: block;
		height: 81px;
		margin: 0 10px 10px 0;
		border: 1px solid #BDBCBC;		
		
	}
	div.gallery a img {
		height: 81px;
		margin: 0;
		
	}	
	
	
	p.eet {
		text-align: center;
		font-size: 0.8em;
	}

	