/*

FARBY:
ruzova:	#E50C80, #CC006D
modra:	#0790BA
zlta:	#FBE21B

#id - one per page
.class - multiple per page
*/

html {
   overflow-y:scroll;
   overflow-x:auto;}

body {
	text-align: center;
	background:#f8f8f8;
	font-family: Arial;
	font-size: 13px;
	line-height: 25px;
	margin: 0;}
	
a {  color:#0790BA;
	text-decoration: none;
	outline:none;}

ul{margin-left:0px;}
a:hover {text-decoration: none; color:#CC006D;}

img{border:0;}

h1{
	font-size:24px;
	color:#4d4d4d;
	padding:20px 0 20px 0;
	margin:0 0 0 0;
	text-shadow:1px 1px 0 #fff;
	}

p{text-align:justify;}

p.space{margin: 0 50px 30px 0; 
	}

p{margin:15px 30px 10px 0;}
	
ul#index{
	padding-left:20px;list-style-type: square;margin-top:0; margin-left:0px;
	}

ul#index li{background-repeat: no-repeat;
background-position: 0; 
padding: 5px 0 5px 5px;
}

li.skusenost{background-image: url(img/skusenost.png);}
li.ponuka{background-image: url(img/ponuka.png);}
li.starostlivost{background-image: url(img/starostlivost.png);}
li.ceny{background-image: url(img/ceny.png);}
li.dovoz{background-image: url(img/dovoz.png);}

ul.kontakty{
	padding-left:0px;list-style-type: none;margin-top:0;margin-left:0;width:300px;
	}

ul.kontakty li{background-repeat: no-repeat;
background-position: 0 10px; 
padding: 5px 0 10px 50px;
}

li.rozne{background-image: url(img/kontakt-rozne.png);}
li.adresa{background-image: url(img/kontakt-adresa.png);}
li.hodiny{background-image: url(img/kontakt-hodiny.png);}
li.adresar{background-image: url(img/kontakt-adresar.png);}
li.faktury{background-image: url(img/kontakt-faktury.png);}



.wrapper{
	text-align:left;
	margin: 0 auto;
	width:980px;}

.left{float:left;}
.right{float:right}	
.clear{clear:both;}

.pink {background:#CC006D}
.blue {background:#0790BA}
.yellow {background:#FBE21B}
.black {background:#666}

#titulka.pink .wrapper {background: url('img/fade-pink.png') no-repeat left top;}
#titulka.pink .wrapper  img{margin-top:45px; margin-bottom:45px;}


#titulka.blue .wrapper {background: url('img/fade-blue.png') no-repeat left top;}
#titulka.blue .wrapper  img{margin-top:45px;margin-bottom:45px;}

#titulka.yellow .wrapper {background: url('img/fade-yellow.png') no-repeat left top;}
#titulka.yellow .wrapper  img{margin-top:45px;margin-bottom:45px;}

#titulka.black .wrapper {background: url('img/fade-black.png') no-repeat left top;}
#titulka.black .wrapper  img{margin-top:45px;margin-bottom:45px;}

#titulka.index{background:url('img/slider-bg.png') repeat-x top left;}

.row{float:left; width:220px;}
	
#small {width:40%}
#large {width: 60%}
#larger {width:76%;}
#smaller {width:20%}
#third {width:33%}

#top{
	background:#f8f8f8;
	}

#logo{
	float:left;
	width:160px;
	margin:10px 0 40px 0;
}	

#navigacia{
	float:right;}
	
#titulka{
	
	}

#shadow-top{
	background: url('img/shadow-top.png') repeat-x left top;
	height:5px !important;margin:0px; padding:0 0 0 0 ; 
}
	

#shadow-bottom{
	background: url('img/shadow-bottom.png') repeat-x left bottom;
	height:5px !important;margin:0px; padding:0 0 0 0;}	
	
#content{
	background:#f8f8f8; padding:30px 0 20px 0;
	}


#footer1{
	background:#ccc;
	color:#333;
	font-size:12px;
	}

#footer1 a{color:#333;}
#footer1 a:hover{color:#000;}
#footer1 h1 {font-size:14px; text-shadow:1px 1px 0 #fff;padding:20px 0 5px 0;}

#footer1 ul{
	padding:0 0 15px 0;list-style-type: none;margin-top:0;
	}
	
#footer1 li{
	padding: 0;
}

#footer2{
	background:#333;
	color:#ccc;
	font-size:12px;
	padding:20px 0 60px 0;
	}
#footer2 a{color:#287AA9}
#footer2 a:hover{color:#ccc;text-decoration:underline;}

#loga{
	margin:60px 0 20px 0}

	
/************************ KLIENTI ************************/	
	
#klienti-vertical{
	width:165px;
	margin:10px;
	padding:20px;
	border:1px solid #e6e6e6;
	float:left;}
	
.klienti-vertical {
	display: block;
	float:left;
	width: 165px;
	height: 634px;
	background: url('img/klienti-vertical.png') bottom;
	text-indent: -99999px;
}

.klienti-vertical:hover {
	background-position: 0 0;}
	
#klienti-horisontal{
	width:950px;
	margin:20px 15px;
	float:left;}
	
.klienti-horisontal {
	display: block;
	float:left;
	width: 950px;
	height: 92px;
	background: url('img/klienti-horisontal.png') bottom;
	text-indent: -99999px;
}

.klienti-horisontal:hover {
	background-position: 0 0;}	
	
	
	
/************************ BUTTONY ************************/


#cena{
	width:322px;
	margin:30px 10px 30px 0;
	float:left;}
	
.cena-blue {
	display: block;
	float:left;
	width: 322px;
	height: 53px;
	background: url('img/button-cena-blue.png') bottom;
	text-indent: -99999px;
}

.cena-blue:hover {
	background-position: 0 0;}


#cennik{
	width:228px;
	margin:30px 10px 30px 0;
	float:left;}

.cena-pink {
	display: block;
	float:left;
	width: 228px;
	height: 53px;
	background: url('img/button-cena-pink.png') bottom;
	text-indent: -99999px;
}

.cena-pink:hover {
	background-position: 0 0;}


.cena-yellow {
	display: block;
	float:left;
	width: 228px;
	height: 53px;
	background: url('img/button-cena-yellow.png') bottom;
	text-indent: -99999px;
}

.cena-yellow:hover {
	background-position: 0 0;}
	

#servis{
	width:261px;
	margin:30px 10px 30px 0;
	float:left;}

.servis {
	display: block;
	float:left;
	width: 261px;
	height: 53px;
	background: url('img/button-servis.png') bottom;
	text-indent: -99999px;
}

.servis:hover {
	background-position: 0 0;}	
	
	
#kontakt{
	width:158px;
	margin:30px 30px;
	float:left;}
	
.kontakt {
	display: block;
	float:left;
	width: 158px;
	height: 53px;
	background: url('img/button-kontakt.png') bottom;
	text-indent: -99999px;
}

.kontakt:hover {
	background-position: 0 0;}
	
	
/************************ SLIDER ************************/

div#slider1{padding:30px 0 0 0;}
div#slider1 img#tonery{float:left; margin: 30px 70px 0 30px;}
div#slider1 img#tlaciarne{float:left; margin: 0 70px 0 30px;}
div#slider1 img#papier{float:left; margin: 20px 70px 0 30px;}
div#slider1 img#service{float:left; margin: 0 70px 0 30px;}
div#slider1 img#title{margin:40px 0 10px;}
div#slider1 img#button{margin:10px 0 0 0}
div#slider1 img#button:hover{opacity:0.9; filter:alpha(opacity=90); /* For IE8 and earlier */}
.pager-active{color:#CC006D}


/************************ MENU ************************/

/******** passive ********/
ul#menu {
height:34px;
/*background:url(img/sprite.png) repeat-x;*/
list-style:none;
margin:30px 0 20px 0;
padding:0;
width:480px;
}

ul#menu li {
float:left;
}

ul#menu li a {
background:url(img/sprite.png) no-repeat scroll top left;
display:block;
height:34px;
position:relative;
}

ul#menu li a.tonery {
width:110px;
}
ul#menu li a.tlaciarne {
width:143px;
background-position:-110px 0px;
}

ul#menu li a.papier {
width:118px;
background-position:-261px 0px;
}

ul#menu li a.servis {
width:109px;
background-position:-370px 0px;
}

/******** hover & aktivny stav********/

ul#menu li a span {
background:url(img/sprite.png) no-repeat scroll bottom left;
display:block;
position:absolute;
top:0;
left:0;
height:100%;
width:100%;
z-index:100;
}

ul#menu li a.tonery span {
background-position:0px -35px;
}

ul#menu li a.tonery#active {
background-position:0px -35px;
}

ul#menu li a.tlaciarne span {
background-position:-110px -35px;
}

ul#menu li a.tlaciarne#active {
background-position:-110px -35px;
}

ul#menu li a.papier span {
background-position:-261px -35px;
}

ul#menu li a.papier#active {
background-position:-261px -35px;
}

ul#menu li a.servis span {
background-position:-370px -35px;
}

ul#menu li a.servis#active {
background-position:-370px -35px;
}

ul#menu li a span:hover {
cursor:pointer;
}